Percabangan bersyarat: jika, '?'

Terkadang, kita perlu melakukan tindakan berbeda berdasarkan kondisi berbeda.

Untuk melakukan itu, kita dapat menggunakan pernyataan if dan operator kondisional ? , itu juga disebut operator “tanda tanya”.

Pernyataan “jika”.

Pernyataan if(...) mengevaluasi kondisi dalam tanda kurung dan, jika hasilnya true , mengeksekusi blok kode.

Misalnya:

 let year = prompt('Pada tahun berapa spesifikasi ECMAScript-2015 diterbitkan?', '');

if (tahun == 2015) alert( 'Anda benar!' );

Pada contoh di atas, kondisinya adalah pemeriksaan kesetaraan sederhana ( year == 2015 ), namun bisa jauh lebih rumit.

Jika kita ingin mengeksekusi lebih dari satu pernyataan, kita harus membungkus blok kode kita di dalam kurung kurawal:

 jika (tahun == 2015) {
  alert("Benar!");
  alert("Kamu pintar sekali!");
}

Kami merekomendasikan untuk membungkus blok kode Anda dengan kurung kurawal {} setiap kali Anda menggunakan pernyataan if , meskipun hanya ada satu pernyataan yang harus dieksekusi. Melakukan hal itu akan meningkatkan keterbacaan.

Konversi Boolean

Pernyataan if (…) mengevaluasi ekspresi dalam tanda kurung dan mengubah hasilnya menjadi boolean.

Mari kita mengingat kembali aturan konversi dari bab Jenis Konversi:

• Angka 0 , string kosong "" , null , undefined , dan NaN semuanya menjadi false . Oleh karena itu nilai-nilai tersebut disebut nilai-nilai yang “palsu”.

• Nilai-nilai lain menjadi true , sehingga disebut “kebenaran”.

Jadi, kode dalam kondisi ini tidak akan pernah dijalankan:

 if (0) { // 0 salah
  ...
}

…dan dalam kondisi ini – akan selalu:

 if (1) {/ // 1 benar
  ...
}

Kita juga dapat meneruskan nilai boolean yang telah dievaluasi sebelumnya ke if , seperti ini:

 misalkan cond = (tahun == 2015); // kesetaraan bernilai benar atau salah

jika (lanjutan) {
  ...
}

Klausa “lainnya”.

Pernyataan if mungkin berisi blok else opsional. Ini dijalankan ketika kondisinya salah.

Misalnya:

 let year = prompt('Pada tahun berapa spesifikasi ECMAScript-2015 diterbitkan?', '');

jika (tahun == 2015) {
  alert('Tebakan anda benar!' );
} kalau tidak {
  alert('Kok bisa salah begitu?'); // nilai apa pun kecuali 2015
}

Beberapa kondisi: “else if”

Terkadang, kami ingin menguji beberapa varian suatu kondisi. Klausa else if memungkinkan kita melakukan itu.

Misalnya:

 let year = prompt('Pada tahun berapa spesifikasi ECMAScript-2015 diterbitkan?', '');

jika (tahun < 2015) {
  alert('Terlalu pagi...');
} else if (tahun > 2015) {
  peringatan('Terlambat');
} kalau tidak {
  alert('Tepat sekali!');
}

Pada kode di atas, JavaScript terlebih dahulu memeriksa year < 2015 . Jika salah, lanjutkan ke kondisi berikutnya year > 2015 . Jika itu juga salah, ini akan menampilkan alert terakhir.

Mungkin ada lebih banyak else if diblokir. else terakhir adalah opsional.

Operator bersyarat '?'

Terkadang, kita perlu menetapkan variabel bergantung pada suatu kondisi.

Misalnya:

 biarkan aksesDiizinkan;
biarkan umur = prompt('Berapa umurmu?', '');

jika (umur > 18) {
  accessAllowed = benar;
} kalau tidak {
  accessAllowed = salah;
}

peringatan(aksesDiizinkan);

Operator yang disebut “kondisional” atau “tanda tanya” memungkinkan kita melakukannya dengan cara yang lebih singkat dan sederhana.

Operator diwakili oleh tanda tanya ? . Kadang-kadang disebut “ternary”, karena operator memiliki tiga operan. Ini sebenarnya satu-satunya operator di JavaScript yang memiliki operator sebanyak itu.

Sintaksnya adalah:

 biarkan hasil = kondisi ? nilai1 : nilai2;

condition dievaluasi: jika benar maka value1 dikembalikan, jika tidak – value2 .

Misalnya:

 biarkan accessAllowed = (usia > 18) ? benar : salah;

Secara teknis, kita dapat menghilangkan tanda kurung di sekitar age > 18 . Operator tanda tanya memiliki prioritas rendah, sehingga dijalankan setelah perbandingan > .

Contoh ini akan melakukan hal yang sama seperti contoh sebelumnya:

 // operator perbandingan "usia > 18" tetap dijalankan terlebih dahulu
// (tidak perlu membungkusnya dalam tanda kurung)
biarkan accessAllowed = umur > 18 ? benar : salah;

Namun tanda kurung membuat kode lebih mudah dibaca, jadi sebaiknya gunakan tanda kurung.

Harap dicatat:

Pada contoh di atas, Anda dapat menghindari penggunaan operator tanda tanya karena perbandingannya sendiri mengembalikan true/false :

 // sama
biarkan accessAllowed = umur > 18;

Banyak '?'

Urutan operator tanda tanya ? dapat mengembalikan nilai yang bergantung pada lebih dari satu kondisi.

Misalnya:

 misalkan umur = prompt('umur?', 18);

biarkan pesan = (umur <3) ? 'Hai sayang!' :
  (usia <18) ? 'Halo!' :
  (usia < 100) ? 'Salam!' :
  'Sungguh usia yang tidak biasa!';

peringatan( pesan );

Mungkin sulit pada awalnya untuk memahami apa yang sedang terjadi. Namun setelah dilihat lebih dekat, kita dapat melihat bahwa ini hanyalah rangkaian pengujian biasa:

1. Tanda tanya pertama memeriksa apakah age < 3 .

2. Jika benar – ia akan mengembalikan 'Hi, baby!' . Jika tidak, lanjutkan ke ekspresi setelah titik dua “:”, centang age < 18 .

3. Jika itu benar – ia akan mengembalikan 'Hello!' . Jika tidak, lanjutkan ke ekspresi setelah titik dua berikutnya “:”, periksa age < 100 .

4. Jika itu benar – ia akan mengembalikan 'Greetings!' . Jika tidak, ini akan berlanjut ke ekspresi setelah titik dua terakhir “:”, yang mengembalikan 'What an unusual age!' .

Begini tampilannya menggunakan if..else :

 jika (umur < 3) {
  pesan = 'Hai sayang!';
} else if (umur < 18) {
  pesan = 'Halo!';
} else if (umur < 100) {
  pesan = 'Salam!';
} kalau tidak {
  message = 'Usia yang tidak biasa!';
}

Penggunaan '?' yang non-tradisional

Terkadang tanda tanya ? digunakan sebagai pengganti if :

 let company = prompt('Perusahaan mana yang membuat JavaScript?', '');

(perusahaan == 'Netscape') ?
   alert('Benar!') : alert('Salah.');

Tergantung pada kondisinya company == 'Netscape' , ekspresi pertama atau kedua setelah ? dieksekusi dan menunjukkan peringatan.

Kami tidak menetapkan hasil ke variabel di sini. Sebagai gantinya, kami mengeksekusi kode yang berbeda tergantung kondisinya.

Tidak disarankan menggunakan operator tanda tanya dengan cara ini.

Notasinya lebih pendek dari pernyataan if yang setara, yang menarik bagi beberapa pemrogram. Namun kurang terbaca.

Berikut adalah kode yang sama yang digunakan if untuk perbandingan:

 let company = prompt('Perusahaan mana yang membuat JavaScript?', '');

if (perusahaan == 'Netscape') {
  waspada('Benar!');
} kalau tidak {
  alert('Salah.');
}

Mata kita memindai kode secara vertikal. Blok kode yang mencakup beberapa baris lebih mudah dipahami daripada kumpulan instruksi horizontal yang panjang.

Tujuan dari operator tanda tanya ? adalah mengembalikan satu nilai atau lainnya tergantung pada kondisinya. Silakan gunakan untuk hal itu. Gunakan if ketika Anda perlu mengeksekusi cabang kode yang berbeda.

Tugas

if (string dengan nol)

pentingnya: 5

Apakah alert akan ditampilkan?

 jika ("0") {
  peringatan('Halo' );
}

larutan

Ya, itu akan terjadi.

String apa pun kecuali yang kosong (dan "0" tidak kosong) menjadi true dalam konteks logis.

Kita dapat menjalankan dan memeriksa:

 jika ("0") {
  peringatan('Halo' );
}

Nama JavaScript

pentingnya: 2

Dengan menggunakan konstruksi if..else , tulis kode yang menanyakan: 'Apa nama “resmi” JavaScript?'

Jika pengunjung memasukkan “ECMAScript”, maka keluaran “Benar!”, jika tidak – keluaran: “Anda tidak tahu? Skrip ECMA!”

Demo di jendela baru

larutan

 <!DOCTYPEhtml>
<html>

<tubuh>
  <skrip>
    'gunakan ketat';

    let value = prompt('Apa nama "resmi" JavaScript?', '');

    if (nilai == 'ECMAScript') {
      waspada('Benar!');
    } kalau tidak {
      alert("Anda tidak tahu? ECMAScript!");
    }
  </skrip>


</tubuh>

</html>

Tunjukkan tandanya

pentingnya: 2

Menggunakan if..else , tulis kode yang mendapatkan nomor melalui prompt dan kemudian ditampilkan di alert :

• 1 , jika nilainya lebih besar dari nol,

• -1 , jika kurang dari nol,

• 0 , jika sama dengan nol.

Dalam tugas ini kami berasumsi bahwa inputnya selalu berupa angka.

Demo di jendela baru

larutan

 biarkan nilai = prompt('Ketikkan angka', 0);

jika (nilai > 0) {
  peringatan( 1 );
} lain jika (nilai < 0) {
  peringatan( -1 );
} kalau tidak {
  peringatan( 0 );
}

Tulis ulang 'jika' menjadi '?'

pentingnya: 5

Tulis ulang ini if menggunakan operator kondisional '?' :

 biarkan hasilnya;

jika (a + b < 4) {
  hasil = 'Di Bawah';
} kalau tidak {
  hasil = 'Selesai';
}

larutan

 misalkan hasil = (a + b < 4) ? 'Di Bawah' : 'Di Atas';

Tulis ulang 'if..else' menjadi '?'

pentingnya: 5

Tulis ulang if..else menggunakan beberapa operator ternary '?' .

Agar mudah dibaca, disarankan untuk membagi kode menjadi beberapa baris.

 biarkan pesan;

if (login == 'Karyawan') {
  pesan = 'Halo';
} else if (login == 'Direktur') {
  pesan = 'Salam';
} lain jika (masuk == '') {
  pesan = 'Tidak ada login';
} kalau tidak {
  pesan = '';
}

larutan

 biarkan pesan = (login == 'Karyawan') ? 'Halo' :
  (login == 'Direktur') ? 'Salam' :
  (masuk == '') ? 'Tidak ada login':
  '';