Ternary Operator: Cara Singkat Menulis If-Else

Nama "Ternary" berasal dari fakta bahwa operator ini adalah satu-satunya operator dalam JavaScript yang menerima tiga argumen (operand). Seringkali disebut sebagai "Shorthand If", operator ini sangat berguna untuk memberikan nilai pada variabel secara kondisional.

1. Struktur Sintaksis

Ternary operator menggunakan simbol tanda tanya (?) dan titik dua (:).

kondisi ? eksekusi_jika_true : eksekusi_jika_false;

• Bagian 1 (Kondisi): Pernyataan yang menghasilkan true atau false.

• Bagian 2 (?): Menandakan "Jika benar, maka...".

• Bagian 3 (:): Menandakan "Jika salah (else), maka...".

2. Perbandingan: If-Else vs Ternary

Mari kita lihat perbedaan ruang yang dibutuhkan untuk tugas yang sama, misalnya menentukan status kelulusan:

Menggunakan If-Else (5 Baris):

let nilai = 80;
let status; if (nilai >= 75) { status = "Lulus";
} else { status = "Gagal";
}

Menggunakan Ternary (1 Baris):

let nilai = 80;
let status = (nilai >= 75) ? "Lulus" : "Gagal";

3. Kapan Harus Menggunakannya?

Meskipun sangat praktis, ada etika dalam menggunakannya agar kode tetap mudah dibaca:

• Gunakan jika: Logikanya sangat sederhana (hanya dua kemungkinan balikkan nilai).

• Hindari jika: Anda memiliki banyak kondisi (else if) atau logika yang bersarang (nested ternary). Terlalu banyak ternary yang ditumpuk akan membuat kode sulit dipahami oleh rekan tim pengembang Anda.

Tutorial: Implementasi pada Komponen Website

Ternary operator sangat sering digunakan dalam pengembangan Front-End untuk mengatur tampilan UI secara dinamis:

let isLoggingIn = true; // Menampilkan pesan selamat datang atau tombol login
let pesan = isLoggingIn ? "Selamat datang kembali, Dika!" : "Silakan masuk ke akun Anda"; // Mengatur warna tombol secara dinamis
let warnaTombol = isLoggingIn ? "hijau" : "merah"; console.log(pesan); // Output: Selamat datang kembali, Dika!

Tabel Ringkasan

Kesimpulan

Ternary operator adalah alat yang ampuh untuk memangkas baris kode yang tidak perlu. Sebagai pengembang, menggunakan ini akan membuat kode Anda terlihat lebih modern dan efisien. Namun, selalu prioritaskan keterbacaan kode di atas segalanya.