JavaScript - Operator Kondisional
Halo sana, para ahli JavaScript masa depan! Hari ini, kita akan melihat dunia magis operator kondisional. Jangan khawatir jika Anda belum pernah menulis satu baris kode sebelumnya - saya akan menjadi panduan ramah Anda dalam perjalanan yang menarik ini. Jadi, ambil keyboard virtual Anda (tikus), dan mari kita melancarkan beberapa mantra kondisional!
Apa Itu Operator Kondisional?
Imaginasi Anda adalah lampu lalu lintas. Tugas Anda adalah untuk menentukan apakah mobil harus maju atau berhenti. Itu tepat seperti yang dilakukan operator kondisional di JavaScript - mereka membantu program kita membuat keputusan berdasarkan kondisi tertentu.
Operator Ternary: pisau swiss army dari kondisional
Bintang dari pertunjukan hari ini adalah operator ternary. Itu seperti if-else
yang ringkas dan sangat efisien. mari kitauraikan ini:
kondisi ? ekspresiJikaBenar : ekspresiJikaSalah
Itu seperti jika kita menanyakan sesuatu:
- Jika jawabannya ya (benar), lakukan hal pertama.
- Jika jawabannya tidak (salah), lakukan hal kedua.
Sintaks: Resep untuk Magic Kondisional
mari kita lihat bahan-bahan dari potion kondisional kita:
-
kondisi
: Ini adalah pertanyaan kita. Apakah hujan? Apakah pengguna masuk? Apakah nomor genap? -
?
: Ini seperti mengatakan "kemudian..." -
ekspresiJikaBenar
: apa yang harus dilakukan jika kondisi benar -
:
: Ini seperti mengatakan "walau..." -
ekspresiJikaSalah
: apa yang harus dilakukan jika kondisi salah
Contoh 1: Penentuk Cuaca
mari kita mulai dengan contoh sederhana. Kita akan membuat program yang menentukan apakah membawa payung berdasarkan cuaca.
let isRaining = true;
let decision = isRaining ? "Bawa payung" : "Tinggalkan payung di rumah";
console.log(decision);
Jika Anda menjalankan kode ini, itu akan mencetak: "Bawa payung"
mari kitauraikan ini:
-
isRaining
adalah kondisi kita. Itu diatur ketrue
. - Jika hujan (
isRaining
benar), ekspresi kita mengembalikan "Bawa payung". - Jika tidak hujan, itu akan mengembalikan "Tinggalkan payung di rumah".
- Kita menyimpan hasil ini di variabel
decision
.
Coba mengubah isRaining
ke false
dan lihat apa yang terjadi!
Contoh 2: Pemeriksa Umur
Sekarang, mari kita membuat program yang memeriksa apakah seseorang cukup tua untuk pemilihan umum.
let age = 20;
let canVote = age >= 18 ? "Ya, Anda bisa pemilih!" : "Maaf, Anda terlalu muda untuk pemilihan umum.";
console.log(canVote);
Ini akan mencetak: "Ya, Anda bisa pemilih!"
mari kita lihat apa yang terjadi:
- Kita mengatur
age
ke 20. - Kondisi kita adalah
age >= 18
(apakah umur sama atau lebih besar dari 18?). - Jika benar, kita mengembalikan "Ya, Anda bisa pemilih!".
- Jika salah, kita mengembalikan "Maaf, Anda terlalu muda untuk pemilihan umum."
Coba mengubah umur ke 16 dan lihat bagaimana output berubah!
Contoh 3: Penentuk Nilai
mari kita membuat lebih kompleks. Kita akan membuat program yang menentukan nilai berdasarkan skor.
let score = 85;
let grade = score >= 90 ? 'A' :
score >= 80 ? 'B' :
score >= 70 ? 'C' :
score >= 60 ? 'D' : 'F';
console.log(`Nilai Anda adalah: ${grade}`);
Ini akan mencetak: "Nilai Anda adalah: B"
Wah, itu terlihat berbeda! Kita sebenarnya menggabungkan beberapa operator ternary bersamaan. Itu seperti air terjun keputusan:
- Pertama, kita memeriksa jika skor adalah 90 atau lebih. Jika ya, itu 'A'.
- Jika tidak, kita memeriksa jika skor adalah 80 atau lebih. Jika ya, itu 'B'.
- Ini terus berlanjut ke 'F' untuk skor di bawah 60.
Itu teknik yang kuat, tapi gunakanlah dengan bijak - terlalu banyak rangkaian bisa membuat kode Anda sulit untuk dibaca!
Menangani nilai null: Operator Null Coalescing
kadang-kadang, kita harus berurusan dengan nilai null
atau undefined
. Operator null coalescing: ??
let username = null;
let displayName = username ?? "Guest";
console.log(`Selamat datang, ${displayName}!`);
Ini akan mencetak: "Selamat datang, Guest!"
mari kita lihat apa yang terjadi:
- Jika
username
adalahnull
atauundefined
, kita gunakan "Guest" saja. - Jika
username
memiliki nilai, kita gunakan itu.
Itu cara praktis untuk menyediakan nilai default!
Cheatsheet Operator Kondisional
mari ini adalah tabel rujukan cepat dari operator yang kita pelajari:
Operator | Nama | Tujuan |
---|---|---|
?: |
Operator Ternary | Buat keputusan antara dua nilai berdasarkan kondisi |
?? |
Operator Null Coalescing | Sediakan nilai default saat berurusan dengan null atau undefined
|
Ingat, latihan membuat sempurna! Cobalah membuat contoh Anda sendiri dan eksperimen dengan operator ini. Sebelum Anda tahu, Anda akan menjadi pengatur orkestra keputusan dalam kode Anda!
Selamat coding, dan may your conditionals always be true (when you want them to be)!
Credits: Image by storyset