Pelajaran 3: Mengambil keputusan dengan if

Program yang berguna harus bisa memilih. Kalau saldo cukup, boleh beli. Kalau kosong, tampilkan peringatan. Kemampuan memilih ini bernama KondisiInstruksi bersyarat, jalankan sesuatu hanya kalau syaratnya terpenuhi.Penjelasan lengkap →, dan alatnya adalah if.

Bentuk dasar if

const saldo = 20000;

if (saldo >= 15000) {
  console.log('Cukup, silakan beli bakso.');
}

Dibaca: “kalau saldo lebih dari atau sama dengan 15000, jalankan isi kurung kurawal.” Syaratnya ditulis di dalam kurung biasa, perintahnya di dalam kurung kurawal. Kalau syarat tidak terpenuhi, isinya dilewati begitu saja.

Alat pembanding

Syarat selalu menghasilkan true (benar) atau false (salah). Pembandingnya:

Tanda	Artinya	Contoh
`===`	sama persis	`nama === 'Rani'`
`!==`	tidak sama	`nama !== 'Rani'`
`>` `<`	lebih besar, lebih kecil	`umur > 17`
`>=` `<=`	besar atau sama, kecil atau sama	`saldo >= 15000`

Kalau tidak, maka… (else)

Tambahkan else untuk jalur kedua:

if (saldo >= 15000) {
  console.log('Cukup, silakan beli bakso.');
} else {
  console.log('Saldo kurang, tabung dulu ya.');
}

Tepat salah satu dari dua blok itu yang jalan, tidak pernah keduanya.

Untuk lebih dari dua pilihan, sambung dengan else if. Komputer memeriksa dari atas dan berhenti di syarat pertama yang benar:

if (nilai >= 85) {
  console.log('A');
} else if (nilai >= 70) {
  console.log('B');
} else {
  console.log('Perlu belajar lagi');
}

Menggabung syarat: && dan ||

Tanda	Dibaca	Benar kalau
`&&`	dan	kedua syarat benar
`\|\|`	atau	salah satu syarat benar

if (umur >= 17 && punyaKtp === true) {
  console.log('Boleh buat SIM.');
}

Coba sendiri

Program kecil yang menentukan kategori nilai. Awalnya nilai bernilai 78.

Kategori nilai

<!DOCTYPE html>
<html lang="id">
<head>
  <meta charset="UTF-8">
  <title>Kategori nilai</title>
</head>
<body>
  <p>Lihat panel Console di bawah.</p>
  <script>
    const nilai = 78;

    if (nilai >= 85) {
      console.log('Kategori A');
    } else if (nilai >= 70) {
      console.log('Kategori B');
    } else {
      console.log('Perlu belajar lagi');
    }

    // Tantangan 1: ganti nilai jadi 90, lalu 50, lihat hasilnya
    // Tantangan 2: tambah else if untuk nilai 60 ke atas (Kategori C)
    // Tantangan 3: buat variabel hadir (true/false), cetak "Lulus"
    //              hanya kalau nilai di atas 60 dan hadir === true
  </script>
</body>
</html>

Hasilnya:

Console

Tantangannya:

Jalankan dan lihat kategori yang muncul. Ganti nilai jadi 90, lalu 50, dan lihat hasilnya berubah.
Tambahkan else if untuk nilai 60 ke atas supaya ada kategori C.
Tambahkan variabel hadir (isi true atau false). Cetak “Lulus” hanya kalau nilai di atas 60 dan hadir === true.

Yang barusan kamu pelajari

if (syarat) { ... } menjalankan isinya hanya kalau syarat benar. else untuk jalur sebaliknya, else if untuk pilihan tambahan.
Pembanding: === sama, !== beda, > < >= <=. Jangan tertukar dengan = yang artinya “simpan ke dalam”.
&& berarti “dan” (kedua harus benar), || berarti “atau” (salah satu cukup).