Langkau ke kandungan
WANCODE
EN

Syarat: Membuat Keputusan

15 minitPemulaHTML · CSS · JS

Dalam pelajaran ini

  • Banding nilai dengan ===, !==, <, >, <=, >= — dan tahu kenapa perlu elak ==
  • Tulis rantaian if / else if / else dalam susunan yang betul
  • Gabungkan syarat dengan &&, || dan !
  • Guna nilai truthy/falsy dan operator ternary ? :

Idea utama

Syarat ialah soalan ya/tidak yang kod anda tanya. Bergantung pada jawapannya — true atau false — ia menjalankan satu blok kod atau yang lain.

Bertanya soalan ya/tidak

JavaScript
const age = 17;
console.log(age >= 18);   // false  (greater than or equal)
console.log(age < 18);    // true
console.log(age === 17);  // true   (strictly equal)
console.log(age !== 17);  // false  (not equal)

=== bukan ==

Satu = memasukkan nilai ke dalam kotak. === bertanya "adakah ini betul-betul sama?". Ada juga ==, yang secara senyap menukar jenis dahulu: "5" == 5 ialah true, tetapi "5" === 5 ialah false. Penukaran tersembunyi itu menyebabkan pepijat, jadi sentiasa guna === dan !==.

if, else if, else

JavaScript
const temperature = 34;

if (temperature >= 33) {
  console.log("Panas gila! Stay indoors.");
} else if (temperature >= 28) {
  console.log("Normal Malaysian weather.");
} else {
  console.log("Sejuk — bring a jacket.");
}

JavaScript menyemak setiap syarat dari atas ke bawah dan hanya menjalankan blok pertama yang syaratnya true; yang lain dilangkau. else menangkap semua yang tidak sepadan. Jadi susunan penting: jika >= 28 diletakkan dahulu, 34°C akan sepadan dengannya dan tidak sampai ke cabang "Panas gila".

Menggabungkan syarat: && || !

&& (AND)
true hanya jika kedua-dua belah benar. hasTicket && age >= 12
|| (OR)
true jika sekurang-kurangnya satu belah benar. isWeekend || isPublicHoliday
! (NOT)
Menterbalikkan true dan false. !isRaining bernilai true apabila tidak hujan.

Truthy dan falsy

if tidak memerlukan boolean sebenar — sebarang nilai boleh digunakan. Enam nilai dikira sebagai falsy (dianggap seperti false): false, 0, "" (string kosong), null, undefined dan NaN. Semua yang lain ialah truthy, termasuk " " (satu ruang), "0" dan "false" — kerana ia string yang tidak kosong.

JavaScript
const nickname = "";
if (nickname) {
  console.log("Hello, " + nickname);
} else {
  console.log("No nickname set"); // this runs — "" is falsy
}

Ternary: if/else dalam satu baris

if / else

JavaScript
let label;
if (stock > 0) {
  label = "In stock";
} else {
  label = "Sold out";
}

Ternary

JavaScript
const label = stock > 0 ? "In stock" : "Sold out";

syarat ? nilaiJikaBenar : nilaiJikaPalsu. Sesuai untuk memilih antara dua nilai; guna if/else biasa untuk apa-apa yang lebih panjang.

getGrade patut memberi "A" untuk 80 ke atas, "B" untuk 60–79, "C" untuk 40–59 dan "Fail" bawah 40. Konsol menunjukkan 85 dapat C! Ikuti rantaian if dengan 85 untuk melihat cabang mana yang menang, kemudian betulkan function itu. Pastikan sempadan (80, 60, 40) masuk ke gred yang betul.

Semakan

  • Markah tinggi dapat A
  • Markah pertengahan dapat B atau C, termasuk sempadan
  • Markah rendah gagal

Uji kefahaman

Q1

Apakah "10" === 10?

Q2

Yang manakah truthy?

Q3

const open = isWeekday || isSaturday; — pada hari Sabtu, isWeekday ialah false dan isSaturday ialah true. Apakah nilai open?

Apa yang anda pelajari

  • Banding dengan ===, !==, <, >, <=, >=. Elakkan == — ia menukar jenis tanpa anda sedar.
  • if / else if / else hanya menjalankan cabang pertama yang sepadan — letakkan syarat paling ketat dahulu.
  • && perlukan kedua-duanya, || perlukan salah satu, ! menterbalikkan. Nilai falsy: false, 0, "", null, undefined, NaN.
  • syarat ? a : b memilih antara dua nilai dalam satu baris.
Pratonton

Output konsol daripada kod anda akan dipaparkan di sini.

Langkah 1 daripada 3