Apabila menulis kod atur cara pasti akan tiba saat untuk aplikasi anda membuat pilihan. Dalam situasi tersebut, kondisi ‘syarat’ akan diguna bagi membantu aplikasi anda membuat pilihan yang tepat dan melaksanakan tindak balas yang betul.

Terdapat tiga jenis syarat if yang disediakan dalam JavaScript

  • Syarat if
  • Syarat if..else
  • Syarat if..else if..
Rajah 1: Flowchart if..else
Rajah 1: Flowchart if..else 

Syarat if
Syarat if merupakan asas kepada kondisi syarat yang membenarkan JavaScript untuk membuat pilihan

Latihan 1
Langkah 1: Buka mana-mana editor teks pilihan anda dan taip kod aturcara berikut

 

Langkah 2: Simpan (Save) hasil kerja anda dengan nama JavaScriptCondition1.html ke dalam Genius Corner

Langkah 3: Klik (Double-click) fail tadi untuk memaparkan hasil berikut pada pelayar web

 

Syarat if..else
Syarat if..else merupakan kaedah kawalan yang mampu memberi lebih banyak pilihan kepada JavaScript untuk melaksanakan keputusan dengan lebih kawalan.

Latihan 2
Langkah 1: Buka mana-mana editor teks pilihan anda dan taip kod aturcara berikut

 

Langkah 2: Simpan hasil kerja anda dengan nama JavaScriptCondition2.html ke dalam folder Genius Corner

Langkah 3: Klik dua kali fail tadi untuk memaparkan hasil berikut pada pelayar web

 

Syarat if..else if
Syarat if..else if merupakan syarat aras tinggi yang membolehkan JavaScript memilih keputusan terbaik dari pelbagai pilihan keadaaan tertentu.

Latihan 3
Langkah 1: Buka mana-mana editor teks pilihan anda dan taip kod atur cara berikut:

 

Langkah 2: Simpan hasil kerja anda dengan nama JavaScriptCondition3. html ke dalam folder Genius Corner

Langkah 3: Klik dua kali fail tadi untuk memaparkan hasil berikut pada pelayar web

 

SEMAKAN

MELALUI latihan pertama JavaScript tadi, kita telah mempelajari tiga contoh syarat if berbeza.

Syarat if asas hanya menyediakan satu pilihan keputusan, manakala if..else dan if..else if pula membenarkan aplikasi anda membuat salah satu dari beberapa keputusan berdasarkan pilihan yang diberi.

SOALAN

SEBELUM ruangan minggu ini ditamatkan, anda perlu menyelesaikan beberapa soalan latihan.

1. Tambahkan elemen <form> HTML pada ketiga-tiga contoh

2. Tambah elemen <input> dan <submit> pada ketiga-tiga <form>

3. Berikan pilihan kepada pengguna untuk ubahsuai syarat if menggunakan <form>

Jika anda mempunyai sebarang pertanyaan atau cadangan, sila tinggalkan komen anda di www.farizgaskin.com dan kami akan cuba jawab sepantas mungkin. Sehingga bertemu lagi dalam ruangan yang sama minggu hadapan, selamat mencuba!