Setiap program yang berguna akhirnya akan sampai ke satu titik keputusan. Patutkah butang ini menghantar borang atau memaparkan ralat? Adakah penggun...

Setiap program yang berguna akhirnya akan sampai ke satu titik keputusan. Adakah butang ini perlu menghantar borang atau memaparkan ralat? Adakah pengguna ini melihat papan pemuka admin atau paparan tetamu? JavaScript menjawab soalan-soalan ini dengan pernyataan bersyarat (conditional statements). Ia adalah injap kawalan kod anda: membuka satu laluan, menutup yang lain, semuanya berdasarkan sama ada sesuatu ungkapan dinilai sebagai benar (true) atau palsu (false). Tanpa pernyataan ini, skrip anda akan berjalan dari atas ke bawah tanpa pernah bertindak balas terhadap orang yang menggunakannya.

Cabang Paling Mudah: if

Pernyataan if adalah pintu gerbang pertama yang anda lalui. Anda meletakkan satu syarat di dalam kurungan. Jika syarat itu bernilai true, blok kod di bawahnya akan dilaksanakan. Jika ia bernilai false, JavaScript akan melangkau blok tersebut sepenuhnya dan meneruskan pembacaan fail.

Inilah yang anda perlukan untuk semakan ringkas yang hanya berlaku sekali sekala. Bayangkan melakukan pengesahan medan borang sebelum anda menghantar apa-apa ke pelayan:

const email = document.getElementById("email").value;

if (email === "") {
  alert("Please enter your email.");
}

Tiada email, tiada penghantaran. Logiknya ringkas dan jelas. Gunakan if apabila hanya terdapat satu kes khas untuk dicegah dan tiada tindakan alternatif yang diperlukan.

Mengendalikan Sama Ada–Atau: if...else

Kebanyakan keputusan sebenar mempunyai dua sisi. Pasangan if...else merangkumi perkara tersebut dengan tepat. Satu blok akan berjalan apabila syarat adalah benar, manakala satu lagi berjalan apabila ia palsu. Kedua-dua laluan ini adalah saling eksklusif.

Bayangkan semakan mod gelap (dark-mode) semasa halaman dimuatkan:

const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;

if (prefersDark) {
  document.body.classList.add("dark");
} else {
  document.body.classList.add("light");
}

Pelayar tidak akan menambah kedua-dua kelas tersebut. Ia memilih satu laluan, melaksanakannya, dan meneruskan tugas. Apabila logik anda terbahagi dengan jelas kepada dua hasil yang mungkin, inilah struktur yang perlu anda gunakan.

Pelbagai Laluan: if...else if...else

Tidak semua masalah bersifat binari. Kadangkala anda memerlukan tangga kemungkinan. Rangkaian if...else if...else membolehkan anda menguji beberapa syarat secara berturutan. JavaScript menilai syarat-syarat tersebut dari atas ke bawah dan menjalankan blok pertama yang syaratnya benar. Selepas padanan itu ditemui, baki tangga tersebut akan diabaikan.

Contoh klasik ialah memetakan skor numerik kepada gred huruf:

const score = 87;
let grade;

if (score >= 90) {
  grade = "A";
} else if (score >= 80) {
  grade = "B";
} else if (score >= 70) {
  grade = "C";
} else {
  grade = "F";
}

Urutan sangat penting di sini. Jika anda menyemak score >= 70 sebelum score >= 90, hampir semua gred lulus akan terperangkap dalam kategori C kerana padanan benar yang pertama akan menang. Susun syarat anda daripada yang paling spesifik kepada yang paling umum, dan sentiasa akhiri rangkaian tersebut dengan else terakhir untuk menangkap apa-apa sahaja yang terlepas.

Memadankan Nilai Tetap: switch

Apabila anda membandingkan satu pemboleh ubah dengan senarai pemalar (constants) yang diketahui, rangkaian if...else yang panjang akan menjadi berserabut. Pernyataan switch memudahkan keadaan tersebut. Ia menilai satu ungkapan sekali sahaja, kemudian membandingkannya dengan label case menggunakan kesamaan ketat (===). Ini menjadikan kod lebih mudah untuk disemak apabila pilihan adalah diskret dan dinamakan.

Pertimbangkan untuk menetapkan waktu kedai berdasarkan hari semasa:

const day = new Date().getDay();

switch (day) {
  case 0:
    console.log("Sunday hours: 10am - 4pm");
    break;
  case 6:
    console.log("Saturday hours: 9am - 6pm");
    break;
  default:
    console.log("Weekday hours: 8am - 8pm");
}

Berhati-hati dengan break. Jika anda mengabaikannya, pelaksanaan akan terus turun ke case seterusnya dan terus berjalan. Tingkah laku tersebut kadangkala berguna, tetapi lebih kerap ia menyebabkan pepijat (bugs) yang tidak disedari. Jika digunakan dengan betul, switch menjadikan niat anda jelas pada pandangan pertama dan memastikan cabang yang berkaitan selari dalam satu lajur yang kemas.

Keputusan Padat: Operator Ternari

Operator ternari—ditulis sebagai ? :—adalah satu ungkapan, bukan satu pernyataan. Perbezaan itu penting