JavaScript - Operator Penentu Condisional
Halo sana, para ahli JavaScript masa depan! Hari ini, kita akan melihat dunia magis operator penentu kondisional. Jangan khawatir jika Anda belum pernah menulis baris kode sebelumnya - saya akan menjadi panduan ramah Anda dalam perjalanan yang menarik ini. Jadi, ambil keyboard virtual Anda (atau " tongkat sihir"), dan mari kita buat some spells (pernyataan) penentu kondisional!
Apa Itu Operator Penentu Kondisional?
Bayangkan Anda adalah lampu lalu lintas. Tugas Anda adalah untuk menentukan apakah mobil harus bergerak atau berhenti. Itu tepat apa yang dilakukan operator penentu kondisional di JavaScript - mereka membantu program kita membuat keputusan berdasarkan kondisi tertentu.
Operator Ternary: Swiss Army Knife 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
Marilah kita lihat bahan-bahan untuk potion kondisional kita:
-
kondisi
: Ini adalah pertanyaan kami. Apakah hujan? Apakah pengguna masuk? Apakah nomor itu genap? -
?
: Ini seperti mengatakan "kemudian..." -
ekspresiJikaBenar
: apa yang harus dilakukan jika kondisi benar -
:
: Ini seperti mengatakan "atau..." -
ekspresiJikaSalah
: apa yang harus dilakukan jika kondisi salah
Contoh 1: Penentu 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 mengeluarkan: "Bawa payung"
mari kitauraikan ini:
-
isRaining
adalah kondisi kami. Itu diatur ketrue
. - Jika hujan (
isRaining
benar), ekspresi kembali "Bawa payung". - Jika tidak hujan, itu akan kembali "Tinggalkan payung di rumah".
- Kita menyimpan hasil ini dalam variabel
decision
.
Cobalah 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 memilih.
let age = 20;
let canVote = age >= 18 ? "Ya, Anda bisa memilih!" : "Maaf, Anda terlalu muda untuk memilih.";
console.log(canVote);
Ini akan mengeluarkan: "Ya, Anda bisa memilih!"
mari kitauraikan ini:
- Kita mengatur
age
ke 20. - Kondisi kami adalah
age >= 18
(apakah umur lebih besar atau sama dengan 18?). - Jika benar, kita kembali "Ya, Anda bisa memilih!".
- Jika salah, kita kembali "Maaf, Anda terlalu muda untuk memilih."
Cobalah mengubah umur ke 16 dan lihat bagaimana output berubah!
Contoh 3: Penentu 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 mengeluarkan: "Nilai Anda adalah: B"
Wah, ini terlihat berbeda! Kita sebenarnya menggabungkan beberapa operator ternary bersamaan. Itu seperti air terjun keputusan:
- Pertama, kita memeriksa apakah skor adalah 90 atau lebih. Jika ya, itu 'A'.
- Jika tidak, kita memeriksa apakah itu 80 atau lebih. Jika ya, itu 'B'.
- Ini terus berlanjut ke 'F' untuk skor di bawah 60.
Ini adalah teknik yang kuat, tapi gunakanlah dengan bijak - terlalu banyak rangkaian bisa membuat kode Anda sulit dibaca!
Menangani nilai null
: Operator Null Coalescing
kadang-kadang, kita harus berurusan dengan nilai null
atau undefined
. Masuk ke operator null coalescing: ??
let username = null;
let displayName = username ?? "Guest";
console.log(`Selamat datang, ${displayName}!`);
Ini akan mengeluarkan: "Selamat datang, Guest!"
mari kitauraikan ini:
- Jika
username
adalahnull
atauundefined
, kita gunakan "Guest" sebagai gantinya. - Jika
username
memiliki nilai, kita gunakan itu.
Ini adalah cara praktis untuk memberikan nilai default!
Cheatsheet Operator Kondisional
Berikut adalah tabel rujukan cepat dari operator yang kita pelajari:
Operator | Nama | Tujuan |
---|---|---|
?: |
Operator Ternary | Buat keputusan antara dua nilai berdasarkan kondisi |
?? |
Operator Null Coalescing | Provide a default value when dealing with null or undefined
|
Ingat, latihan membuat sempurna! Cobalah membuat contoh Anda sendiri dan eksperimen dengan operator ini. Sebelum Anda tahu, Anda akan menjadi pengarah orkestra penuh keputusan dalam kode Anda!
Selamat coding, dan semoga kondisional Anda selalu benar (ketika Anda memerlukannya)!
Credits: Image by storyset