JavaScript Fundamental: Operators & Conditional - Eps 2

Apa itu Operator

Nah, setelah kita belajar tentang variable dan tipe data di episode sebelumnya, sekarang saatnya kita masuk ke materi yang lebih seru lagi. Kali ini kita bakal ngobrolin tentang operator di JavaScript. Tenang aja, ini gak seseram yang kamu bayangin kok.

Jadi gini, bayangkan kamu punya dua angka, misalnya 5 dan 3. Terus kamu pengen tambahin, kurangin, atau bandingin kedua angka itu. Nah, disinilah operator berperan.

Operator itu kayak alat bantu yang memungkinkan kita untuk memanipulasi nilai atau membandingkan nilai-nilai yang ada di dalam code kita. Simpelnya, operator itu adalah simbol-simbol khusus yang digunain buat ngerjain sesuatu sama nilai-nilai yang kita punya.

Misalnya kamu mau nambahin dua angka, kamu pake operator plus (+). Atau kamu mau ngecek apakah dua nilai itu sama atau ngga, kamu bisa pake operator perbandingan.

Di JavaScript, ada tiga tipe operator utama yang perlu kamu pahami dengan baik:

Pertama, ada arithmetic operators yang dipake buat operasi matematika dasar kayak tambah, kurang, kali, bagi.

Kedua, ada comparison operators yang fungsinya buat membandingkan dua nilai dan ngasih hasil true atau false.

Ketiga, ada logical operators yang biasanya dipake buat nggabungin beberapa kondisi sekaligus.

Kenapa sih kita perlu belajar operator? Karena hampir semua logic program yang kamu bikin pasti butuh operasi matematika atau perbandingan.

Bayangin aja kamu bikin aplikasi kasir, pasti butuh operasi tambah buat ngitung total belanjaan. Atau kamu bikin sistem login, pasti butuh operator perbandingan buat ngecek apakah password yang dimasukin user itu benar atau salah.

Jadi intinya, tanpa operator, code kamu bakal cuman bisa nyimpen data doang tanpa bisa ngolah data tersebut. Operator ini yang bikin program kamu jadi dinamis dan bisa ngambil keputusan berdasarkan kondisi tertentu.

Di materi kali ini, kita bakal bedah satu-satu ketiga tipe operator tersebut dengan contoh-contoh yang gampang dipahami. Kita juga bakal bahas gimana cara kerja masing-masing operator dan kapan waktu yang tepat buat pake operator tertentu.

Plus, kita bakal explore juga beberapa konsep penting kayak operator precedence dan truthy/falsy values yang sering bikin bingung pemula.

Siap? Yuk kita mulai dari operator yang paling sering dipake dulu, yaitu arithmetic operators!

Arithmetic Operators

Arithmetic Operators Thumbnail and 9 more pages - Personal - Microsoft Edge 22_12_2025 16_19_47.png

Oke, sekarang kita masuk ke operator pertama yang bakal kamu pake hampir di setiap project, yaitu arithmetic operators. Ini adalah operator yang dipake buat operasi matematika dasar. Kalau kamu inget pelajaran matematika waktu SD, nah kurang lebih sama kok.

Di JavaScript, ada enam operator aritmatika yang perlu kamu kuasai. Mari kita bahas satu-satu dengan contoh yang gampang dipahamin.

Operator Addition (+)

Operator ini dipake buat nambahin dua nilai. Simple banget kan? Misalnya kamu punya dua angka dan pengen dijumlahin:

let hargaBuku = 50000;
let hargaPulpen = 5000;
let total = hargaBuku + hargaPulpen;

console.log(total); // Output: 55000

Mudah banget kan? Tapi hati-hati, operator plus ini juga bisa dipake buat nggabungin string. Jadi kalau kamu nambahin dua string, hasilnya adalah penggabungan string tersebut, bukan penjumlahan angka.

Operator Subtraction (-)

Kebalikan dari addition, operator ini dipake buat ngurangin nilai. Misalnya kamu punya uang terus dipake buat beli sesuatu:

let saldo = 100000;
let hargaBarang = 35000;
let sisaSaldo = saldo - hargaBarang;

console.log(sisaSaldo); // Output: 65000

Operator Multiplication (*)

Operator perkalian ini dipake kalau kamu mau ngaliin dua nilai. Contohnya kamu beli barang yang sama beberapa kali:

let hargaSatuan = 15000;
let jumlah = 3;
let totalHarga = hargaSatuan * jumlah;

console.log(totalHarga); // Output: 45000

Operator Division (/)

Nah, kalau kamu mau bagi-bagi nilai, pake operator ini. Misalnya kamu mau bagi rata uang ke beberapa orang:

let totalUang = 100000;
let jumlahOrang = 4;
let bagianPerOrang = totalUang / jumlahOrang;

console.log(bagianPerOrang); // Output: 25000

Tapi ingat ya, kalau kamu bagi dengan nol, hasilnya bakal jadi Infinity. JavaScript gak bakal error, tapi hasilnya gak berguna juga.

Operator Modulo (%)

Ini operator yang mungkin agak asing buat beberapa orang. Modulo itu fungsinya buat ngambil sisa hasil bagi. Jadi bukan hasil baginya, tapi sisanya.

let angka = 10;
let pembagi = 3;
let sisa = angka % pembagi;

console.log(sisa); // Output: 1

Kenapa 1? Karena 10 dibagi 3 itu hasilnya 3 sisa 1. Nah, si modulo ini ngambil sisanya aja.

Operator modulo ini sering dipake buat ngecek apakah suatu angka itu ganjil atau genap. Caranya gimana? Kamu tinggal modulo angka tersebut dengan 2. Kalau hasilnya 0, berarti genap. Kalau 1, berarti ganjil.

let angkaGenap = 8;
let angkaGanjil = 7;

console.log(angkaGenap % 2); // Output: 0 (genap)
console.log(angkaGanjil % 2); // Output: 1 (ganjil)

Operator Exponentiation ()**

Operator ini buat pangkat. Jadi kalau kamu mau ngitung angka pangkat berapa, pake operator ini. Misalnya 2 pangkat 3:

let basis = 2;
let pangkat = 3;
let hasil = basis ** pangkat;

console.log(hasil); // Output: 8

Kenapa 8? Karena 2 x 2 x 2 = 8. Operator ini baru ada di JavaScript versi ES2016 (ES7), jadi kalau kamu lihat code lama, mungkin mereka pake Math.pow() sebagai gantinya.

Operator Precedence (Urutan Operasi)

Nah, ini bagian yang penting banget. Sama kayak di matematika, JavaScript juga punya aturan urutan operasi. Gak semua operator dijalanin dari kiri ke kanan loh.

Aturan dasarnya gini:

  1. Perkalian (*) dan pembagian (/) dikerjain duluan
  2. Baru addition (+) dan subtraction (-)

Jadi kalau kamu punya operasi kayak gini:

let hasil = 2 + 3 * 4;
console.log(hasil); // Output: 14

Kenapa hasilnya 14, bukan 20? Karena JavaScript ngerjain perkalian dulu (3 * 4 = 12), baru ditambahin 2. Jadi 2 + 12 = 14.

Tapi kalau kamu pengen operasi addition dikerjain dulu, kamu bisa pake tanda kurung (parentheses):

let hasil = (2 + 3) * 4;
console.log(hasil); // Output: 20

Sekarang hasilnya jadi 20, karena operasi di dalam kurung dikerjain dulu. Jadi 2 + 3 = 5, terus 5 * 4 = 20.

Tips Penting

Dalam prakteknya, sangat disarankan buat selalu pake tanda kurung kalau kamu punya operasi yang kompleks. Ini bukan cuma buat mastiin urutan operasinya bener, tapi juga bikin code kamu lebih gampang dibaca sama orang lain.

Misalnya, meskipun ini secara teknis benar:

let hasil = 10 + 5 * 2 - 3;

Tapi akan lebih baik kalau ditulis kayak gini:

let hasil = 10 + (5 * 2) - 3;

Dengan begitu, siapapun yang baca code kamu langsung paham urutan operasinya gimana.

Operator aritmatika ini adalah fondasi dari semua operasi matematika di JavaScript. Kamu bakal pake operator-operator ini terus di hampir semua project yang kamu bikin. Jadi pastiin kamu udah paham betul ya!

Selanjutnya, kita bakal bahas comparison operators yang fungsinya buat membandingkan nilai. Tapi sebelum itu, coba dulu praktekin contoh-contoh di atas biar makin paham!

Comparison Operators

Arithmetic Operators Thumbnail and 9 more pages - Personal - Microsoft Edge 22_12_2025 16_21_52.png

Setelah kita belajar tentang arithmetic operators, sekarang waktunya kita masuk ke operator yang gak kalah penting, yaitu comparison operators. Operator ini fungsinya buat bandingin dua nilai, dan hasilnya selalu berupa boolean (true atau false).

Kenapa operator ini penting? Karena hampir semua logic program kamu bakal butuh perbandingan. Misalnya ngecek apakah user udah login, apakah umur user udah cukup, atau apakah password yang dimasukin itu bener. Semua itu butuh comparison operators.

Operator Equality: === dan ==

Ini adalah operator yang paling sering dipake dan juga paling sering bikin bingung pemula. Ada dua jenis operator equality di JavaScript: strict equality (===) dan loose equality (==).

Mari kita bahas strict equality dulu, karena ini yang recommended buat dipake:

let angka = 5;
let string = "5";

console.log(angka === 5);      // Output: true
console.log(angka === string); // Output: false

Operator === ini ngecek dua hal sekaligus: nilainya sama atau ngga, DAN tipe datanya juga harus sama. Jadi meskipun angka 5 dan string "5" secara nilai sama, tapi tipe datanya beda (number vs string), jadinya hasilnya false.

Sekarang kita liat loose equality (==):

let angka = 5;
let string = "5";

console.log(angka == 5);      // Output: true
console.log(angka == string); // Output: true

Loh kok bisa jadi true? Nah, ini yang namanya type coercion. Operator == ini cuma ngecek nilainya aja, dia gak peduli sama tipe datanya. JavaScript bakal otomatis ngubah tipe data salah satu nilai biar bisa dibandingin.

Dalam contoh di atas, JavaScript ngubah string "5" jadi number 5, terus baru dibandingin. Makanya hasilnya jadi true.

Kenapa Harus Pake === ?

Pertanyaan bagus! Ini adalah salah satu best practice yang wajib kamu ikutin. Kenapa? Karena type coercion dari operator == bisa bikin hasil yang gak terduga dan susah di-debug.

Contohnya liat kasus-kasus aneh ini:

console.log(0 == false);        // true (loh?)
console.log("" == false);       // true (hah?)
console.log(null == undefined); // true (kok bisa?)

Semuanya jadi true karena type coercion! Ini bisa bikin bug yang susah banget di-track. Makanya, developer JavaScript profesional hampir selalu pake === buat avoid masalah kayak gini.

Dengan ===, hasil perbandingannya lebih predictable:

console.log(0 === false);        // false
console.log("" === false);       // false
console.log(null === undefined); // false

Jauh lebih aman kan?

Operator Not Equal: !== dan !=

Sama kayak equality, not equal juga punya dua versi: strict (!==) dan loose (!=). Logikanya sama persis, cuma dibalik aja.

Operator !== ngecek apakah dua nilai itu BEDA, baik dari segi nilai maupun tipe data:

let angka = 5;
let string = "5";

console.log(angka !== 10);     // Output: true (beda nilai)
console.log(angka !== string); // Output: true (beda tipe)
console.log(angka !== 5);      // Output: false (sama persis)

Dan sama kayak sebelumnya, selalu pake !== daripada != buat avoid masalah type coercion.

Operator Relational: <, >, <=, >=

Operator-operator ini dipake buat bandingin nilai numerik. Konsepnya simple, sama kayak matematika biasa:

let umur = 17;

console.log(umur < 18);  // Output: true (17 kurang dari 18)
console.log(umur > 18);  // Output: false (17 ngga lebih dari 18)
console.log(umur <= 17); // Output: true (17 kurang dari atau sama dengan 17)
console.log(umur >= 18); // Output: false (17 ngga lebih dari atau sama dengan 18)

Operator < artinya "kurang dari", > artinya "lebih dari", <= artinya "kurang dari atau sama dengan", dan >= artinya "lebih dari atau sama dengan".

Operator ini sangat berguna buat ngecek range nilai. Misalnya kamu mau validasi umur user harus minimal 17 tahun:

let umurUser = 20;
let minimumUmur = 17;

if (umurUser >= minimumUmur) {
    console.log("Umur valid");
} else {
    console.log("Umur belum cukup");
}

Perbandingan String

Operator relational juga bisa dipake buat bandingin string, tapi cara kerjanya agak berbeda. JavaScript bandingin string berdasarkan urutan alfabetis:

console.log("apple" < "banana"); // Output: true
console.log("zebra" > "apple");  // Output: true

Tapi hati-hati, perbandingan string itu case-sensitive. Huruf besar (uppercase) dianggap "lebih kecil" dari huruf kecil (lowercase):

console.log("Apple" < "apple"); // Output: true

Jadi kalau kamu mau bandingin string, biasanya lebih baik diubah dulu ke lowercase semua pake method .toLowerCase().

Practical Example

Biar lebih jelas, liat contoh penggunaan real-world dari comparison operators:

let hargaBarang = 150000;
let budgetUser = 200000;
let stokBarang = 5;

// Cek apakah user punya cukup budget
if (budgetUser >= hargaBarang) {
    console.log("Budget cukup");
}

// Cek apakah stok masih ada
if (stokBarang > 0) {
    console.log("Barang masih tersedia");
}

// Cek apakah harga exact match
let inputHarga = 150000;
if (inputHarga === hargaBarang) {
    console.log("Harga sesuai");
}

Tips Penting

  1. Selalu pake === dan !== kecuali kamu bener-bener ngerti dan butuh type coercion
  2. Hati-hati bandingin string, ingat case-sensitive
  3. Validasi tipe data dulu sebelum bandingin, pastiin kedua nilai yang dibandingin itu tipe datanya sesuai

Comparison operators ini adalah fondasi dari conditional logic. Kamu bakal pake operator-operator ini terus buat bikin decision di program kamu. Jadi pastiin kamu udah paham betul perbedaan antara === dan ==, karena ini salah satu kesalahan paling umum yang sering dilakuin sama pemula.

Selanjutnya kita bakal bahas logical operators yang bisa nggabungin beberapa comparison sekaligus. Stay tuned!

Logical Operators

Comparison Operators Thumbnail and 9 more pages - Personal - Microsoft Edge 22_12_2025 16_23_03.png

Oke, sekarang kita masuk ke operator yang bakal bikin logic program kamu jadi lebih powerfull: logical operators. Kalau comparison operators cuma bisa bandingin dua nilai, logical operators ini bisa nggabungin beberapa kondisi sekaligus.

Misalnya kamu mau ngecek apakah user udah login DAN umurnya di atas 18 tahun. Atau kamu mau ngecek apakah user punya akses admin ATAU akses moderator. Nah, disinilah logical operators berperan.

Operator AND (&&)

Operator && ini dibaca "AND" atau "dan". Konsepnya simple: kedua kondisi harus bernilai true, baru hasilnya true. Kalau salah satu aja false, maka hasilnya pasti false.

Bayangin kayak gini: kamu bisa masuk ke klub malam kalau kamu punya KTP DAN umur kamu minimal 21 tahun. Kalau salah satu syarat aja gak terpenuhi, kamu gak bisa masuk.

let punyaKTP = true;
let umur = 22;

if (punyaKTP && umur >= 21) {
    console.log("Boleh masuk");
} else {
    console.log("Tidak boleh masuk");
}

Dalam contoh di atas, kedua kondisi harus true: punyaKTP harus true DAN umur >= 21 juga harus true. Kalau salah satu false, hasilnya false.

Liat contoh lain yang lebih kompleks:

let username = "admin";
let password = "rahasia123";
let isActive = true;

if (username === "admin" && password === "rahasia123" && isActive) {
    console.log("Login berhasil");
} else {
    console.log("Login gagal");
}

Ketiga kondisi harus true semua baru login berhasil. Kalau username salah, meskipun password bener, tetap gak bisa login.

Operator OR (||)

Operator || ini dibaca "OR" atau "atau". Beda sama AND, operator OR cukup satu kondisi aja yang true, maka hasilnya udah true.

Bayangin kayak gini: kamu bisa dapet diskon kalau kamu member ATAU kamu punya voucher. Salah satu aja udah cukup buat dapet diskon.

let isMember = false;
let punyaVoucher = true;

if (isMember || punyaVoucher) {
    console.log("Dapat diskon");
} else {
    console.log("Tidak dapat diskon");
}

Dalam contoh di atas, meskipun isMember bernilai false, tapi karena punyaVoucher true, maka kondisinya tetap true dan user dapat diskon.

Contoh lain yang sering dipake:

let role = "moderator";

if (role === "admin" || role === "moderator") {
    console.log("Punya akses dashboard");
} else {
    console.log("Akses ditolak");
}

User dengan role admin ATAU moderator bisa akses dashboard. Gak harus keduanya, salah satu aja cukup.

Operator NOT (!)

Operator ! ini fungsinya buat membalik nilai boolean. True jadi false, false jadi true. Simple tapi sangat berguna.

let isLoggedIn = false;

if (!isLoggedIn) {
    console.log("Silahkan login dulu");
}

Tanda ! di depan isLoggedIn artinya "NOT isLoggedIn" atau "bukan isLoggedIn". Jadi kalau isLoggedIn bernilai false, maka !isLoggedIn jadi true.

Operator NOT ini sering dipake buat ngecek kondisi negatif. Misalnya ngecek apakah user belum login, apakah stok barang kosong, atau apakah email belum diverifikasi.

let emailVerified = false;

if (!emailVerified) {
    console.log("Email belum diverifikasi");
    console.log("Cek inbox kamu");
}

Kamu juga bisa pake double NOT (!!) buat convert nilai apapun jadi boolean. Tapi ini jarang dipake dan bisa bikin bingung, jadi avoid aja kalau gak perlu.

Short-Circuit Evaluation

Nah, ini adalah konsep yang agak advanced tapi penting banget buat dipahami. JavaScript itu "malas" dalam arti baik. Kalau dia udah tau hasilnya, dia gak bakal ngecek kondisi sisanya.

Untuk operator &&, kalau kondisi pertama udah false, JavaScript gak bakal ngecek kondisi berikutnya karena udah pasti hasilnya false.

let x = false;
let y = true;

console.log(x && y); // Output: false (y gak di-evaluate)

Untuk operator ||, kalau kondisi pertama udah true, JavaScript gak bakal ngecek kondisi berikutnya karena udah pasti hasilnya true.

let a = true;
let b = false;

console.log(a || b); // Output: true (b gak di-evaluate)

Ini bukan cuma soal performa, tapi juga bisa dipake buat teknik yang sering dipake developer: default values.

Penggunaan Default Values

Salah satu trik paling berguna dari short-circuit evaluation adalah buat kasih nilai default. Ini sering banget dipake:

let username = "";
let displayName = username || "Guest";

console.log(displayName); // Output: "Guest"

Gimana cara kerjanya? Karena username bernilai empty string (yang dianggap falsy), JavaScript lanjut ke nilai berikutnya yaitu "Guest". Jadi displayName dapat nilai "Guest".

Kalau username ada isinya:

let username = "budi";
let displayName = username || "Guest";

console.log(displayName); // Output: "budi"

Karena username bernilai "budi" (truthy), JavaScript langsung pake nilai itu dan gak ngecek "Guest".

Ini sangat berguna buat handling parameter function atau property object yang mungkin kosong:

function greet(name) {
    let displayName = name || "Teman";
    console.log("Halo " + displayName);
}

greet("Siti");  // Output: "Halo Siti"
greet();        // Output: "Halo Teman"

Kombinasi Logical Operators

Kamu bisa nggabungin beberapa logical operators sekaligus buat bikin logic yang lebih kompleks:

let age = 25;
let hasLicense = true;
let hasInsurance = true;

if (age >= 18 && hasLicense && hasInsurance) {
    console.log("Boleh nyetir");
} else {
    console.log("Tidak boleh nyetir");
}

Atau kombinasi AND dan OR:

let role = "editor";
let isPremium = true;

if ((role === "admin" || role === "editor") && isPremium) {
    console.log("Akses ke fitur premium");
}

Dalam contoh di atas, user harus punya role admin ATAU editor, DAN harus punya akun premium.

Tips Penting

  1. Pake parentheses kalau nggabungin AND dan OR biar jelas urutan evaluasinya
  2. Hati-hati dengan truthy/falsy values pas pake short-circuit evaluation
  3. Jangan bikin kondisi terlalu kompleks dalam satu baris, pecah jadi beberapa variable kalau perlu
// Kurang readable
if (user.age >= 18 && user.hasLicense && (user.role === "admin" || user.role === "moderator") && user.isActive) {
    // do something
}

// Lebih readable
let isAdult = user.age >= 18;
let canDrive = user.hasLicense;
let hasModeratorAccess = user.role === "admin" || user.role === "moderator";
let isActive = user.isActive;

if (isAdult && canDrive && hasModeratorAccess && isActive) {
    // do something
}

Logical operators ini adalah tools yang powerfull buat bikin decision logic di program kamu. Kombinasi sama comparison operators, kamu bisa bikin kondisi apapun yang kamu butuhkan.

Tapi ingat, makin kompleks kondisinya, makin susah di-maintain. Jadi selalu prioritaskan readability daripada bikin one-liner yang keliatan keren tapi susah dipahami.

Selanjutnya kita bakal bahas tentang truthy dan falsy values yang sangat relate sama logical operators ini!

Truthy & Falsy Values

JavaScript Fundamental_ Operators & Conditional - Eps 2 and 8 more pages - Personal - Microsoft Edge 22_12_2025 16_23_56.png

Nah, setelah kita bahas tentang logical operators, sekarang waktunya kita bahas konsep yang sangat penting di JavaScript: truthy dan falsy values. Ini adalah konsep yang sering bikin pemula bingung, tapi sekali paham, ini bakal sangat berguna banget.

Di JavaScript, setiap nilai itu punya "kecenderungan" buat dianggap true atau false kalau dipake dalam konteks boolean. Misalnya dalam kondisi if atau logical operators. Nilai yang dianggap sebagai false disebut "falsy", dan nilai yang dianggap sebagai true disebut "truthy".

Falsy Values: 6 Nilai yang Dianggap False

Di JavaScript, cuma ada 6 nilai yang dianggap falsy. Sisanya semua truthy. Kamu harus hafalin 6 nilai ini karena sering banget kepake:

  1. false - boolean false (ya jelas dong)
  2. 0 - angka nol
  3. "" atau '' - string kosong
  4. null - nilai null
  5. undefined - nilai undefined
  6. NaN - Not a Number

Itu aja! Cuma 6. Gampang kan buat dihafalin?

Mari kita liat contoh gimana nilai-nilai ini bekerja:

if (false) {
    console.log("Ini gak bakal jalan");
}

if (0) {
    console.log("Ini juga gak bakal jalan");
}

if ("") {
    console.log("Ini pun gak bakal jalan");
}

if (null) {
    console.log("Ini juga tidak jalan");
}

if (undefined) {
    console.log("Ini gak jalan juga");
}

if (NaN) {
    console.log("Ini juga gak akan jalan");
}

Semua kondisi di atas bakal dianggap false, jadi code di dalemnya gak bakal dijalankan.

Truthy Values: Semua Selain Falsy

Sekarang bagian yang menarik: SEMUA nilai selain 6 falsy values di atas itu dianggap truthy. Termasuk nilai-nilai yang mungkin gak kamu sangka.

Contohnya:

if ("0") {
    console.log("String '0' itu truthy!"); // Ini bakal jalan
}

if ("false") {
    console.log("String 'false' juga truthy!"); // Ini juga jalan
}

if ([]) {
    console.log("Array kosong itu truthy!"); // Ini juga jalan
}

if ({}) {
    console.log("Object kosong juga truthy!"); // Ini juga jalan
}

if (-1) {
    console.log("Angka negatif itu truthy!"); // Ini juga jalan
}

Ini sering bikin pemula kaget. String "0" itu truthy meskipun isinya angka nol. String "false" juga truthy meskipun tulisannya false. Array kosong dan object kosong juga truthy.

Intinya, kalau bukan salah satu dari 6 falsy values, berarti truthy!

Practical Use Case

Nah, sekarang pertanyaannya: kenapa konsep ini penting? Karena ini bikin code kamu jadi lebih concise dan readable.

1. Checking Variable Existence

Salah satu penggunaan paling umum adalah buat ngecek apakah suatu variable ada atau tidak:

let username;

if (username) {
    console.log("Welcome " + username);
} else {
    console.log("Please login");
}

Dalam contoh di atas, kalau username belum di-set (undefined) atau kosong (""), kondisinya bakal false. Kalau username punya nilai, kondisinya true.

Ini lebih simple daripada nulis:

if (username !== undefined && username !== null && username !== "") {
    console.log("Welcome " + username);
}

2. Default Values dengan Logical OR

Ini adalah pattern yang udah kita bahas sebelumnya:

function greet(name) {
    let displayName = name || "Guest";
    console.log("Hello " + displayName);
}

greet("Andi");  // Output: "Hello Andi"
greet();        // Output: "Hello Guest"
greet("");      // Output: "Hello Guest"

Karena empty string dan undefined itu falsy, JavaScript akan pake nilai default "Guest".

3. Checking Array or Object

Ini berguna buat ngecek apakah data udah ada sebelum dipake:

let users = getUsers(); // function yang mungkin return array atau null

if (users) {
    console.log("Total users: " + users.length);
} else {
    console.log("No users found");
}

4. Conditional Rendering

Dalam framework kayak React, pattern ini sangat umum:

let isLoading = false;
let data = fetchData();

if (!isLoading && data) {
    console.log("Display data:", data);
}

Hati-Hati dengan Pitfalls

Meskipun truthy/falsy sangat berguna, ada beberapa hal yang perlu kamu waspadain:

Pitfall 1: Angka 0

Angka 0 itu falsy, jadi kalau kamu mau ngecek angka, harus lebih hati-hati:

let score = 0;

if (score) {
    console.log("Score: " + score); // Ini gak bakal jalan!
}

Kalau kamu mau ngecek apakah score ada, lebih baik explicit:

if (score !== undefined && score !== null) {
    console.log("Score: " + score); // Ini baru bener
}

Atau pake typeof:

if (typeof score === "number") {
    console.log("Score: " + score);
}

Pitfall 2: String "0" vs Number 0

Ini sering bikin bingung:

console.log(0 == false);    // true (falsy)
console.log("0" == false);  // true (type coercion)
console.log("0" === false); // false (different types)

if ("0") {
    console.log("String '0' is truthy!"); // Ini jalan
}

if (0) {
    console.log("Number 0 is falsy"); // Ini gak jalan
}

Pitfall 3: Empty Array dan Object

Array kosong dan object kosong itu truthy, padahal "kosong". Jadi kalau kamu mau ngecek apakah array punya isi:

let items = [];

if (items) {
    console.log("Items exist"); // Ini jalan meskipun array kosong
}

if (items.length) {
    console.log("Items have content"); // Ini gak jalan
}

// Cara yang bener:
if (items && items.length > 0) {
    console.log("Items have content");
}

Best Practices

  1. Pakai truthy/falsy untuk simple checks kayak ngecek variable existence
  2. Pakai explicit comparison kalau nilai 0 atau empty array/object itu valid
  3. Jangan andalkan type coercion kalau kamu gak 100% paham konsekuensinya
  4. Dokumentasiin code kalau kamu rely on truthy/falsy behavior

Contoh yang baik:

// Good: clear intention
let user = getUser();
if (user) {
    displayProfile(user);
}

// Good: explicit check for number
let count = getCount();
if (typeof count === "number") {
    displayCount(count);
}

// Bad: ambiguous
let value = getValue();
if (value) {
    // Gak jelas apakah ini ngecek existence atau valid value
}

Konsep truthy dan falsy ini adalah salah satu keunikan JavaScript yang harus kamu kuasai. Ini bikin code kamu lebih concise, tapi juga bisa bikin bug kalau gak hati-hati.

Jadi selalu ingat: ada 6 falsy values (false, 0, "", null, undefined, NaN), dan semua yang lain itu truthy. Pake dengan bijak, dan code kamu bakal lebih clean!

Selanjutnya kita bakal bahas gimana cara pake truthy/falsy ini dalam if/else statement dengan lebih detail.

If/Else Statement

JavaScript Fundamental_ Operators & Conditional - Eps 2 and 8 more pages - Personal - Microsoft Edge 22_12_2025 16_24_52.png

Oke, setelah kita pahamin tentang comparison operators, logical operators, dan truthy/falsy values, sekarang saatnya kita pake semua pengetahuan itu buat bikin decision logic. Dan tools utama yang kita pake adalah if/else statement.

If/else statement ini adalah cara paling dasar dan paling sering dipake buat bikin program kamu bisa "mikir" dan ngambil keputusan berdasarkan kondisi tertentu.

Syntax Dasar If Statement

Bentuk paling sederhana dari if statement itu kayak gini:

if (condition) {
    // code yang dijalankan kalau condition true
}

Contoh real-world:

let umur = 20;

if (umur >= 18) {
    console.log("Kamu sudah dewasa");
}

Kalau kondisi umur >= 18 bernilai true, maka code di dalam kurung kurawal bakal dijalankan. Kalau false, ya gak dijalankan.

If/Else: Handling Dua Kondisi

Tapi seringkali kita butuh handle dua kemungkinan: kalau kondisi true jalanin ini, kalau false jalanin yang itu. Nah, di sinilah else berperan:

let umur = 15;

if (umur >= 18) {
    console.log("Kamu sudah dewasa");
} else {
    console.log("Kamu masih anak-anak");
}

Sekarang kalau umur >= 18 false, program bakal jalanin code di bagian else.

Contoh lain yang lebih praktis:

let password = "rahasia123";
let inputPassword = "rahasia456";

if (inputPassword === password) {
    console.log("Login berhasil");
    console.log("Selamat datang!");
} else {
    console.log("Password salah");
    console.log("Silakan coba lagi");
}

If/Else If/Else: Multiple Conditions

Bagaimana kalau kamu punya lebih dari dua kondisi? Misalnya kamu mau ngecek grade nilai A, B, C, D, atau E. Di situ kamu bisa pake else if:

let nilai = 85;

if (nilai >= 90) {
    console.log("Grade: A");
} else if (nilai >= 80) {
    console.log("Grade: B");
} else if (nilai >= 70) {
    console.log("Grade: C");
} else if (nilai >= 60) {
    console.log("Grade: D");
} else {
    console.log("Grade: E");
}

JavaScript bakal ngecek kondisi dari atas ke bawah. Kalau ketemu kondisi yang true, dia jalanin code-nya terus langsung keluar. Gak ngecek kondisi yang di bawahnya lagi.

Jadi kalau nilai adalah 85, dia bakal masuk ke kondisi nilai >= 80 dan print "Grade: B", terus berhenti. Gak ngecek kondisi nilai >= 70 lagi.

Contoh lain buat sistem diskon:

let totalBelanja = 750000;
let diskon = 0;

if (totalBelanja >= 1000000) {
    diskon = 20;
} else if (totalBelanja >= 500000) {
    diskon = 10;
} else if (totalBelanja >= 100000) {
    diskon = 5;
} else {
    diskon = 0;
}

console.log("Diskon kamu: " + diskon + "%");

Nested If: If di Dalam If

Kamu juga bisa taro if statement di dalam if statement lain. Ini namanya nested if:

let umur = 25;
let punyaSIM = true;

if (umur >= 18) {
    if (punyaSIM) {
        console.log("Boleh nyetir mobil");
    } else {
        console.log("Umur cukup, tapi belum punya SIM");
    }
} else {
    console.log("Umur belum cukup");
}

Tapi hati-hati, nested if yang terlalu dalam bisa bikin code kamu susah dibaca. Liat contoh yang jelek ini:

// Bad: terlalu banyak nesting
if (user) {
    if (user.isActive) {
        if (user.hasPermission) {
            if (user.isPremium) {
                if (feature.isEnabled) {
                    // do something
                }
            }
        }
    }
}

Ini yang namanya "pyramid of doom" atau "callback hell". Susah banget dibaca dan di-maintain.

Best Practice: Avoid Deep Nesting

Ada beberapa cara buat avoid deep nesting:

1. Gunakan Logical Operators

Daripada nested if, pake logical operators:

// Good: lebih readable
if (user && user.isActive && user.hasPermission && user.isPremium && feature.isEnabled) {
    // do something
}

2. Early Return

Ini adalah pattern yang sangat recommended, terutama di dalam function:

function canAccessFeature(user, feature) {
    // Check conditions early and return immediately
    if (!user) {
        return false;
    }

    if (!user.isActive) {
        return false;
    }

    if (!user.hasPermission) {
        return false;
    }

    if (!user.isPremium) {
        return false;
    }

    if (!feature.isEnabled) {
        return false;
    }

    return true;
}

Dengan early return, code jadi lebih flat dan gampang dibaca. Setiap kondisi ngecek "alasan untuk gagal" dan langsung return false. Kalau semua lolos, baru return true.

3. Extract ke Function

Kalau kondisinya kompleks, extract jadi function tersendiri:

function isEligibleForDiscount(user) {
    return user.isPremium && user.totalPurchase >= 1000000;
}

function canCheckout(cart, user) {
    if (cart.isEmpty()) {
        return false;
    }

    if (!user.isLoggedIn()) {
        return false;
    }

    return true;
}

// Usage
if (canCheckout(cart, user) && isEligibleForDiscount(user)) {
    applyDiscount();
}

Readable Conditions

Kondisi yang kamu tulis harus jelas dan gampang dipahami. Hindari kondisi yang terlalu kompleks dalam satu baris:

// Bad: susah dipahami
if (user.age >= 18 && user.hasLicense && (user.role === "admin" || user.role === "moderator") && !user.isSuspended && user.lastLogin > Date.now() - 86400000) {
    // do something
}

// Good: extract jadi variable dengan nama yang descriptive
let isAdult = user.age >= 18;
let hasLicense = user.hasLicense;
let isModerator = user.role === "admin" || user.role === "moderator";
let isActive = !user.isSuspended;
let hasRecentLogin = user.lastLogin > Date.now() - 86400000;

if (isAdult && hasLicense && isModerator && isActive && hasRecentLogin) {
    // do something
}

Dengan cara ini, siapapun yang baca code kamu langsung paham apa yang dicek tanpa perlu mikir keras.

Guard Clauses

Pattern lain yang sangat berguna adalah guard clauses. Ini mirip early return, tapi lebih fokus ke validasi di awal function:

function processOrder(order) {
    // Guard clauses di awal
    if (!order) {
        throw new Error("Order tidak valid");
    }

    if (order.items.length === 0) {
        throw new Error("Order kosong");
    }

    if (order.total <= 0) {
        throw new Error("Total order tidak valid");
    }

    // Main logic kalau semua validasi lolos
    calculateShipping(order);
    applyDiscount(order);
    processPayment(order);
    sendConfirmation(order);
}

Guard clauses ini bikin function kamu lebih robust dan gampang di-maintain karena semua validasi ada di awal.

Tips Penting

  1. Selalu pake kurung kurawal meskipun cuma satu baris code. Ini prevent bug:
// Bad: bisa bikin bug
if (condition)
    doSomething();
    doAnotherThing(); // Ini selalu jalan, bukan bagian dari if!

// Good: clear and safe
if (condition) {
    doSomething();
    doAnotherThing();
}

  1. Avoid negative conditions kalau bisa, karena lebih susah dipahami:
// Harder to read
if (!isNotActive) {
    // do something
}

// Easier to read
if (isActive) {
    // do something
}

  1. Prioritize the happy path. Validasi error dulu, baru main logic:
function getUserData(userId) {
    if (!userId) {
        return null;
    }

    // Happy path: get and return user data
    let user = database.getUser(userId);
    return user;
}

If/else statement adalah fondasi dari control flow di JavaScript. Hampir semua program pasti pake ini. Jadi pastiin kamu paham betul cara pakenya dengan bener dan readable.

Selanjutnya kita bakal bahas alternatif dari if/else, yaitu switch statement yang lebih cocok buat kondisi tertentu!

Switch Statement

Switch Statement Thumbnail and 9 more pages - Personal - Microsoft Edge 22_12_2025 16_28_32.png

Setelah kita bahas if/else statement yang bisa handle berbagai kondisi, sekarang kita kenalan sama alternatif lain: switch statement. Switch ini sebenernya fungsinya mirip if/else if/else, tapi dengan cara penulisan yang berbeda dan use case yang lebih spesifik.

Kapan Pake Switch Statement?

Switch statement paling cocok dipake kalau kamu punya satu variable atau value yang mau dicek dengan banyak kemungkinan nilai. Misalnya kamu mau ngecek hari dalam seminggu, bulan dalam setahun, atau status order yang bisa punya banyak kemungkinan.

Kalau pake if/else, bakal kayak gini:

let day = "Senin";

if (day === "Senin") {
    console.log("Hari pertama kerja");
} else if (day === "Selasa") {
    console.log("Masih semangat");
} else if (day === "Rabu") {
    console.log("Tengah minggu");
} else if (day === "Kamis") {
    console.log("Hampir weekend");
} else if (day === "Jumat") {
    console.log("Besok libur!");
} else {
    console.log("Akhir pekan");
}

Lumayan panjang kan? Nah, dengan switch statement, bisa lebih rapi:

let day = "Senin";

switch (day) {
    case "Senin":
        console.log("Hari pertama kerja");
        break;
    case "Selasa":
        console.log("Masih semangat");
        break;
    case "Rabu":
        console.log("Tengah minggu");
        break;
    case "Kamis":
        console.log("Hampir weekend");
        break;
    case "Jumat":
        console.log("Besok libur!");
        break;
    default:
        console.log("Akhir pekan");
}

Lebih terstruktur dan gampang dibaca, terutama kalau casenya banyak.

Syntax Switch Statement

Mari kita bedah struktur dari switch statement:

switch (expression) {
    case value1:
        // code kalau expression === value1
        break;
    case value2:
        // code kalau expression === value2
        break;
    case value3:
        // code kalau expression === value3
        break;
    default:
        // code kalau gak ada case yang match
}

Penjelasannya:

  • expression adalah nilai yang mau dicek
  • case value adalah kemungkinan nilai dari expression
  • break buat keluar dari switch setelah case dijalanin
  • default adalah fallback kalau gak ada case yang match (opsional tapi recommended)

Pentingnya Break Statement

Ini adalah bagian yang paling penting dan sering bikin bug kalau lupa. Perhatiin contoh ini:

let score = "B";

switch (score) {
    case "A":
        console.log("Excellent!");
    case "B":
        console.log("Good job!");
    case "C":
        console.log("Not bad");
    case "D":
        console.log("Need improvement");
    default:
        console.log("Invalid score");
}

Kamu tau outputnya apa? Kalau score adalah "B", outputnya bakal jadi:

Good job!
Not bad
Need improvement
Invalid score

Loh kok semua case dibawahnya ikut jalan? Ini yang namanya fall-through. Kalau kamu gak pake break, JavaScript bakal terus ngejalanincode di case berikutnya sampai ketemu break atau sampai akhir switch.

Makanya hampir selalu kamu butuh break:

let score = "B";

switch (score) {
    case "A":
        console.log("Excellent!");
        break;
    case "B":
        console.log("Good job!");
        break;
    case "C":
        console.log("Not bad");
        break;
    case "D":
        console.log("Need improvement");
        break;
    default:
        console.log("Invalid score");
}

Sekarang outputnya cuma "Good job!" aja, sesuai yang kita mau.

Kapan Fall-Through Berguna?

Meskipun biasanya fall-through itu bug, ada kalanya kamu emang pengen behavior ini. Misalnya kalau beberapa case punya action yang sama:

let bulan = "Februari";
let jumlahHari;

switch (bulan) {
    case "Januari":
    case "Maret":
    case "Mei":
    case "Juli":
    case "Agustus":
    case "Oktober":
    case "Desember":
        jumlahHari = 31;
        break;
    case "April":
    case "Juni":
    case "September":
    case "November":
        jumlahHari = 30;
        break;
    case "Februari":
        jumlahHari = 28;
        break;
    default:
        jumlahHari = 0;
        console.log("Bulan tidak valid");
}

console.log(bulan + " punya " + jumlahHari + " hari");

Dalam contoh ini, beberapa bulan yang punya jumlah hari sama di-group jadi satu. Ini adalah salah satu cara yang valid buat pake fall-through.

Default Case: Safety Net

Default case itu kayak else di if/else statement. Ini bakal dijalanin kalau gak ada case yang match. Sangat recommended buat selalu pake default case:

let status = "UNKNOWN";

switch (status) {
    case "PENDING":
        console.log("Order sedang diproses");
        break;
    case "SHIPPED":
        console.log("Order sudah dikirim");
        break;
    case "DELIVERED":
        console.log("Order sudah sampai");
        break;
    case "CANCELLED":
        console.log("Order dibatalkan");
        break;
    default:
        console.log("Status tidak dikenali: " + status);
        console.log("Silahkan hubungi customer service");
}

Default case ini penting buat handle nilai yang unexpected atau invalid. Ini bikin program kamu lebih robust.

Switch vs If/Else: Kapan Pake Mana?

Pertanyaan yang sering muncul: kapan pake switch, kapan pake if/else?

Pake Switch kalau:

  • Kamu ngecek satu variable dengan banyak kemungkinan nilai yang spesifik
  • Nilai yang dicek adalah nilai exact/pasti (string atau number tertentu)
  • Kamu butuh struktur yang lebih terorganisir buat banyak case

Contoh cocok pake switch:

// User action dalam aplikasi
switch (action) {
    case "CREATE":
        createItem();
        break;
    case "READ":
        readItem();
        break;
    case "UPDATE":
        updateItem();
        break;
    case "DELETE":
        deleteItem();
        break;
    default:
        showError();
}

Pake If/Else kalau:

  • Kamu punya kondisi yang kompleks (lebih dari cuma equality check)
  • Kamu butuh comparison dengan operators kayak >, <, >=, <=
  • Kamu butuh logical operators kayak && atau ||
  • Kondisinya gak cuma ngecek satu variable

Contoh yang lebih cocok pake if/else:

let age = 25;
let hasLicense = true;

// Kondisi kompleks, pake if/else
if (age >= 18 && hasLicense) {
    console.log("Boleh menyetir");
} else if (age >= 18 && !hasLicense) {
    console.log("Umur cukup tapi belum punya SIM");
} else {
    console.log("Belum cukup umur");
}

Contoh Real-World: Payment Method

Liat contoh praktis buat handling payment method:

function processPayment(method, amount) {
    switch (method) {
        case "credit_card":
            console.log("Processing credit card payment of Rp " + amount);
            chargeCreditCard(amount);
            break;
        case "bank_transfer":
            console.log("Processing bank transfer of Rp " + amount);
            generateBankTransferCode();
            break;
        case "e_wallet":
            console.log("Processing e-wallet payment of Rp " + amount);
            redirectToEwallet(amount);
            break;
        case "cod":
            console.log("Cash on delivery selected for Rp " + amount);
            confirmCOD();
            break;
        default:
            console.log("Payment method tidak valid: " + method);
            showPaymentError();
            return false;
    }
    return true;
}

processPayment("e_wallet", 150000);

Tips dan Best Practices

  1. Selalu tambahkan break kecuali kamu emang sengaja mau fall-through behavior
  2. Selalu pake default case buat handle unexpected values
  3. Gunakan const untuk case values kalau case-nya kompleks:
const STATUS_PENDING = "pending";
const STATUS_APPROVED = "approved";
const STATUS_REJECTED = "rejected";

switch (orderStatus) {
    case STATUS_PENDING:
        // handle pending
        break;
    case STATUS_APPROVED:
        // handle approved
        break;
    case STATUS_REJECTED:
        // handle rejected
        break;
}

  1. Jangan bikin case yang terlalu kompleks. Kalau logic di dalam case terlalu panjang, extract jadi function:
switch (userAction) {
    case "REGISTER":
        handleRegistration(); // function terpisah
        break;
    case "LOGIN":
        handleLogin(); // function terpisah
        break;
    case "LOGOUT":
        handleLogout(); // function terpisah
        break;
}

  1. Consider object literal sebagai alternatif buat case yang simple:
// Alternative to switch: object literal
const dayMessages = {
    "Senin": "Hari pertama kerja",
    "Selasa": "Masih semangat",
    "Rabu": "Tengah minggu",
    "Kamis": "Hampir weekend",
    "Jumat": "Besok libur!"
};

let day = "Rabu";
let message = dayMessages[day] || "Akhir pekan";
console.log(message);

Pattern object literal ini lebih concise dan mudah di-maintain kalau action-nya simple.

Common Mistakes

  1. Lupa break - ini yang paling sering terjadi
  2. Gak pake default case - bikin handling error jadi susah
  3. Pake switch buat kondisi kompleks - harusnya pake if/else
  4. Case yang terlalu banyak - mungkin perlu refactor jadi function mapping

Switch statement adalah tools yang powerfull kalau dipake di situasi yang tepat. Dia bikin code kamu lebih organized dan gampang dibaca, terutama kalau kamu punya banyak kemungkinan nilai yang perlu di-handle.

Tapi ingat, jangan maksa pake switch kalau if/else lebih cocok. Pilih tools yang paling sesuai dengan masalah yang kamu hadapi.

Selanjutnya kita bakal bahas ternary operator, cara shorthand buat if/else yang simple!

Ternary Operator

JavaScript Fundamental_ Operators & Conditional - Eps 2 and 8 more pages - Personal - Microsoft Edge 22_12_2025 16_29_32.png

Setelah kita bahas if/else dan switch statement yang cukup verbose, sekarang waktunya kenalan sama cara yang lebih singkat: ternary operator. Ini adalah shorthand buat if/else yang simple dan sering banget dipake sama developer buat bikin code lebih concise.

Apa itu Ternary Operator?

Ternary operator adalah satu-satunya operator di JavaScript yang butuh tiga operand (makanya disebut "ternary"). Struktur dasarnya kayak gini:

condition ? valueIfTrue : valueIfFalse

Bacanya: "kalau condition true, pake valueIfTrue, kalau false pake valueIfFalse".

Mari kita bandingin dengan if/else biasa. Misalnya kamu mau ngecek apakah seseorang udah dewasa:

// Cara biasa dengan if/else
let age = 20;
let status;

if (age >= 18) {
    status = "Adult";
} else {
    status = "Minor";
}

console.log(status); // Output: "Adult"

Dengan ternary operator, bisa disingkat jadi:

let age = 20;
let status = age >= 18 ? "Adult" : "Minor";

console.log(status); // Output: "Adult"

Jauh lebih singkat kan? Cuma satu baris doang!

Syntax dan Cara Kerja

Mari kita bedah lebih detail:

let result = condition ? value1 : value2;

  • condition adalah ekspresi yang menghasilkan true atau false
  • ? adalah separator antara condition dan value kalau true
  • value1 adalah nilai yang dipake kalau condition true
  • : adalah separator antara value true dan value false
  • value2 adalah nilai yang dipake kalau condition false

Contoh-contoh praktis:

// Cek apakah user punya akses
let isAdmin = true;
let access = isAdmin ? "Full Access" : "Limited Access";
console.log(access); // Output: "Full Access"

// Cek stok barang
let stock = 5;
let availability = stock > 0 ? "Available" : "Out of Stock";
console.log(availability); // Output: "Available"

// Cek diskon member
let isMember = true;
let discount = isMember ? 10 : 0;
console.log("Diskon: " + discount + "%"); // Output: "Diskon: 10%"

Use Case: Simple Condition Assignment

Ternary operator paling cocok dipake buat assignment value berdasarkan kondisi simple. Ini adalah use case yang paling umum:

1. Set Default Value

let username = "";
let displayName = username ? username : "Guest";
console.log(displayName); // Output: "Guest"

// Atau bisa pake ini buat lebih singkat
let displayName2 = username || "Guest";

2. Toggle State

let isActive = true;
let newState = isActive ? false : true;

// Atau lebih simple lagi
let toggledState = !isActive;

3. Dynamic Class Names

Ini sering dipake di frontend development:

let isError = true;
let className = isError ? "text-red" : "text-green";
console.log(className); // Output: "text-red"

4. Conditional Rendering

let isLoggedIn = false;
let message = isLoggedIn ? "Welcome back!" : "Please login";
console.log(message); // Output: "Please login"

5. Calculate Value

let quantity = 10;
let price = quantity > 5 ? 8000 : 10000;
console.log("Harga per unit: Rp " + price); // Output: "Harga per unit: Rp 8000"

Kapan Sebaiknya Pake Ternary?

Ternary operator itu bagus, tapi jangan dipake sembarangan. Ada aturan mainnya:

Pake Ternary kalau:

  • Kondisinya simple (cuma satu kondisi)
  • Value yang di-return juga simple
  • Hasilnya langsung di-assign ke variable
  • Code masih gampang dibaca

Jangan Pake Ternary kalau:

  • Kondisinya kompleks dengan banyak logical operators
  • Ada multiple kondisi yang perlu dicek
  • Ada side effects atau function calls yang kompleks
  • Bakal bikin code susah dibaca

Nested Ternary: Avoid!

Salah satu kesalahan pemula adalah pake nested ternary. Ini technically bisa, tapi jangan lakukan! Liat contoh yang jelek ini:

// Bad: nested ternary, susah dibaca
let score = 85;
let grade = score >= 90 ? "A" :
            score >= 80 ? "B" :
            score >= 70 ? "C" :
            score >= 60 ? "D" : "E";

Ini masih bisa dipahami, tapi udah mulai susah dibaca. Kalau ada kasus kayak gini, mending pake if/else atau switch:

// Good: pake if/else, lebih jelas
let score = 85;
let grade;

if (score >= 90) {
    grade = "A";
} else if (score >= 80) {
    grade = "B";
} else if (score >= 70) {
    grade = "C";
} else if (score >= 60) {
    grade = "D";
} else {
    grade = "E";
}

Atau lebih baik lagi, extract jadi function:

function getGrade(score) {
    if (score >= 90) return "A";
    if (score >= 80) return "B";
    if (score >= 70) return "C";
    if (score >= 60) return "D";
    return "E";
}

let grade = getGrade(85);

Readability is King

Prinsip paling penting dalam pake ternary: readability. Code yang singkat tapi susah dibaca itu gak ada gunanya. Selalu tanya diri sendiri: "Apakah orang lain yang baca code ini bakal langsung paham?"

Contoh yang baik:

// Good: jelas dan concise
let canVote = age >= 17 ? true : false;

// Tapi sebenernya bisa lebih simple lagi:
let canVote = age >= 17;

Contoh yang kurang baik:

// Bad: terlalu banyak logic dalam ternary
let result = (user.age >= 18 && user.hasLicense && user.isActive) ?
             processUserAccess(user) :
             showErrorMessage("Access Denied");

Lebih baik pake if/else:

// Good: lebih readable
if (user.age >= 18 && user.hasLicense && user.isActive) {
    result = processUserAccess(user);
} else {
    result = showErrorMessage("Access Denied");
}

Practical Examples

Liat beberapa contoh penggunaan ternary yang baik:

Example 1: Display Message

let itemCount = 5;
let message = itemCount === 1 ? "1 item" : itemCount + " items";
console.log("You have " + message); // Output: "You have 5 items"

Example 2: Price Calculation

let isPremium = true;
let basePrice = 100000;
let finalPrice = isPremium ? basePrice * 0.8 : basePrice;
console.log("Harga: Rp " + finalPrice); // Output: "Harga: Rp 80000"

Example 3: Status Badge

let orderStatus = "shipped";
let badgeColor = orderStatus === "delivered" ? "green" : "yellow";
console.log("Badge color: " + badgeColor); // Output: "Badge color: yellow"

Example 4: Empty Array Check

let items = [];
let display = items.length > 0 ? items : ["No items"];
console.log(display); // Output: ["No items"]

Combining with Template Literals

Ternary operator juga sering dipake bareng template literals buat dynamic string:

let username = "Budi";
let greeting = `Hello${username ? ", " + username : ""}!`;
console.log(greeting); // Output: "Hello, Budi!"

// Atau contoh lain
let count = 3;
let text = `You have ${count} item${count !== 1 ? "s" : ""}`;
console.log(text); // Output: "You have 3 items"

Tips dan Best Practices

  1. Gunakan untuk simple assignment aja. Kalau ada side effects atau function calls yang kompleks, pake if/else.
  2. Max satu ternary per statement. Jangan nested, jangan chained.
  3. Format dengan baik kalau ternary-nya agak panjang:
// Good formatting
let status = isActive
    ? "User is active"
    : "User is inactive";

  1. Consider extracting ke variable kalau condition-nya panjang:
// Instead of this:
let result = user.age >= 18 && user.hasPermission ? "Allow" : "Deny";

// Do this:
let hasAccess = user.age >= 18 && user.hasPermission;
let result = hasAccess ? "Allow" : "Deny";

  1. Jangan sacrife readability demi conciseness. Better readable than clever.

Common Mistakes

  1. Nested ternary - udah dibahas di atas, avoid!
  2. Complex expressions di dalam ternary:
// Bad
let result = condition ? doComplexCalculation() : doAnotherComplexThing();

// Good
let result;
if (condition) {
    result = doComplexCalculation();
} else {
    result = doAnotherComplexThing();
}

  1. Forgetting parentheses buat complex conditions:
// Unclear
let result = a && b ? "yes" : "no";

// Clear
let result = (a && b) ? "yes" : "no";

Ternary operator adalah tools yang powerful buat bikin code lebih concise. Tapi ingat, concise itu bagus kalau tetap readable. Jangan korbanin clarity demi brevity.

Pake ternary buat kasus simple, pake if/else buat yang kompleks. Simple as that!

Selanjutnya kita bakal bahas operator precedence yang penting buat dipahami biar operasi matematika dan logical kamu gak salah urutan!

Operator Precedence

JavaScript operators dan conditional statements - Claude and 8 more pages - Personal - Microsoft Edge 22_12_2025 16_30_30.png

Oke, sekarang kita masuk ke topik yang sering bikin pemula bingung tapi sebenernya gak terlalu susah kalau udah paham konsepnya: operator precedence. Ini adalah aturan yang menentukan urutan operasi mana yang dikerjain duluan kalau ada banyak operator dalam satu ekspresi.

Inget waktu belajar matematika dulu? Ada aturan kali dan bagi dikerjain dulu sebelum tambah dan kurang kan? Nah, di JavaScript juga sama, cuma operatornya lebih banyak.

Kenapa Operator Precedence Penting?

Bayangin kamu punya ekspresi kayak gini:

let result = 5 + 3 * 2;
console.log(result);

Hasilnya apa? 16 atau 11?

Kalau dikerjain dari kiri ke kanan: 5 + 3 = 8, terus 8 * 2 = 16.

Tapi kalau perkalian dikerjain dulu: 3 * 2 = 6, terus 5 + 6 = 11.

Jawabannya adalah 11! Karena operator perkalian (*) punya precedence lebih tinggi daripada penjumlahan (+).

Urutan Operator Precedence

Berikut adalah urutan operator dari yang paling tinggi ke rendah (yang paling tinggi dikerjain duluan):

  1. ! (NOT) - Logical NOT
  2. , /, % - Multiplication, Division, Modulo
  3. +, - Addition, Subtraction
  4. <, >, <=, >= - Relational operators
  5. ===, !== - Equality operators
  6. && - Logical AND
  7. || - Logical OR

Liat contoh gimana precedence ini bekerja:

let a = 10;
let b = 5;
let c = 2;

// Perkalian dikerjain dulu
let result1 = a + b * c;
console.log(result1); // Output: 20 (bukan 30)
// Karena: 5 * 2 = 10, terus 10 + 10 = 20

// NOT dikerjain paling awal
let result2 = !false && true;
console.log(result2); // Output: true
// Karena: !false = true, terus true && true = true

Contoh dengan Logical Operators

Ini yang sering bikin bingung, terutama kalau nggabungin beberapa logical operators:

let x = 5;
let y = 10;
let z = 15;

// AND dikerjain sebelum OR
let result = x < y || y < z && z < 20;
console.log(result); // Output: true

Loh kok true? Mari kita trace:

  1. Pertama, comparison operators dikerjain: x < y jadi true, y < z jadi true, z < 20 jadi true
  2. Jadi ekspresinya jadi: true || true && true
  3. AND dikerjain dulu: true && true jadi true
  4. Terus OR: true || true jadi true

Contoh lain yang agak tricky:

let isActive = true;
let hasPermission = false;
let isAdmin = true;

// Operator precedence: ! -> && -> ||
let canAccess = !hasPermission && isAdmin || isActive;
console.log(canAccess); // Output: true

Mari kita trace lagi:

  1. !hasPermission dikerjain dulu (NOT punya precedence tertinggi): false jadi true
  2. true && isAdmin: jadi true && true = true
  3. true || isActive: jadi true || true = true

Masalah dengan Andalkan Memory

Nah, masalahnya adalah... siapa yang bisa hafal semua urutan precedence ini? Bahkan developer berpengalaman sekalipun gak selalu inget urutan pastinya.

Liat ekspresi ini:

let result = 10 + 5 * 2 - 3 / 3 + 1;

Meskipun kamu tau aturannya, tetep harus mikir kan? Ini adalah code yang tidak ramah buat dibaca.

Solution: Gunakan Parentheses!

Solusi paling simple dan paling recommended adalah: pake tanda kurung (parentheses). Ini bikin code kamu jauh lebih jelas dan gak bergantung sama hafalan.

Contoh yang sama tadi, tapi dengan parentheses:

let result = 10 + (5 * 2) - (3 / 3) + 1;

Sekarang jauh lebih jelas kan? Meskipun parentheses-nya sebenernya gak mengubah hasil (karena * dan / emang dikerjain dulu), tapi ini bikin intent kamu lebih jelas.

Contoh dengan logical operators:

// Tanpa parentheses - susah dibaca
let canEdit = isOwner || isAdmin && hasPermission;

// Dengan parentheses - jelas maksudnya
let canEdit = isOwner || (isAdmin && hasPermission);

Atau kalau maksudnya beda:

// Maksudnya: (isOwner OR isAdmin) AND hasPermission
let canEdit = (isOwner || isAdmin) && hasPermission;

Real-World Examples

Liat beberapa contoh praktis yang sering muncul:

Example 1: Complex Condition

let age = 25;
let hasLicense = true;
let hasInsurance = false;

// Bad: susah dibaca
let canDrive = age >= 18 && hasLicense || hasInsurance && age >= 21;

// Good: jelas dengan parentheses
let canDrive = (age >= 18 && hasLicense) || (hasInsurance && age >= 21);

Example 2: Calculation

let price = 100000;
let quantity = 3;
let discount = 10;

// Bad: kurang jelas
let total = price * quantity - price * quantity * discount / 100;

// Good: jelas step by step
let subtotal = price * quantity;
let discountAmount = (subtotal * discount) / 100;
let total = subtotal - discountAmount;

// Or dengan parentheses:
let total = (price * quantity) - ((price * quantity * discount) / 100);

Example 3: Boolean Logic

let isWeekend = false;
let isHoliday = true;
let hasUrgentTask = false;

// Bad: precedence gak jelas
let canRelax = !hasUrgentTask && isWeekend || isHoliday;

// Good: intent jelas
let canRelax = (!hasUrgentTask) && (isWeekend || isHoliday);

Example 4: Mixed Operations

let base = 100;
let multiplier = 2;
let addition = 50;
let divider = 4;

// Bad: harus mikir precedence
let result = base + multiplier * addition / divider - 10;

// Good: setiap operasi jelas
let result = base + ((multiplier * addition) / divider) - 10;

// Better: break down jadi steps
let multiplied = multiplier * addition;
let divided = multiplied / divider;
let result = base + divided - 10;

Tips untuk Handle Operator Precedence

1. Prioritize Readability

Jangan bikin code yang harus dipikirin lama. Code yang bagus adalah code yang bisa dipahami dalam beberapa detik:

// Readable - langsung paham maksudnya
if ((userRole === "admin" || userRole === "moderator") && isActive) {
    grantAccess();
}

2. Break Complex Expressions

Kalau ekspresinya terlalu kompleks, pecah jadi beberapa variable:

// Instead of this monster:
let eligible = age >= 18 && hasID && (isCitizen || hasWorkPermit) && !isBanned;

// Do this:
let isAdult = age >= 18;
let hasValidID = hasID;
let hasLegalStatus = isCitizen || hasWorkPermit;
let isAllowed = !isBanned;

let eligible = isAdult && hasValidID && hasLegalStatus && isAllowed;

3. Use Parentheses Generously

Jangan pelit pake parentheses. Meskipun technically gak perlu, tapi ini bikin code kamu lebih self-documenting:

// Technical correct, tapi kurang jelas
let result = a + b * c - d / e;

// Lebih jelas dengan parentheses
let result = a + (b * c) - (d / e);

4. Comment Complex Logic

Kalau ekspresinya emang kompleks dan gak bisa dihindari, tambahin comment:

// Calculate final price with tiered discount and tax
// Formula: base price * quantity * (1 - discount%) + tax
let finalPrice = basePrice * quantity * (1 - discount / 100) + tax;

5. Consistent Formatting

Format ekspresi yang panjang dengan consistent biar gampang dibaca:

let isEligible =
    (age >= 18) &&
    (hasID) &&
    (isCitizen || hasWorkPermit) &&
    (!isBanned);

Common Pitfalls

Pitfall 1: Mixing && and ||

// Bisa bikin bingung tanpa parentheses
let result = a || b && c;

// Lebih jelas:
let result = a || (b && c); // AND dikerjain dulu
// atau
let result = (a || b) && c; // kalau maksudnya beda

Pitfall 2: NOT with Other Operators

// Precedence NOT paling tinggi
let result = !isActive && hasPermission;
// Ini artinya: (!isActive) && hasPermission

// Kalau maksudnya beda, pake parentheses:
let result = !(isActive && hasPermission);

Pitfall 3: Arithmetic in Conditions

// Susah dibaca
if (age >= 18 && balance > price * quantity) {
    // ...
}

// Lebih jelas
let totalPrice = price * quantity;
if (age >= 18 && balance > totalPrice) {
    // ...
}

Key Takeaways

  1. Jangan andalkan hafalan operator precedence
  2. Pake parentheses buat bikin intent kamu jelas
  3. Break down ekspresi kompleks jadi beberapa steps
  4. Prioritize readability daripada brevity
  5. Kalau ragu, pake parentheses - gak ada salahnya

Ingat, code kamu bakal dibaca lebih sering daripada ditulis. Code yang jelas itu lebih valuable daripada code yang singkat tapi bikin pusing.

Jadi, mulai sekarang biasakan pake parentheses dan break down ekspresi kompleks. Future you (dan team kamu) bakal berterima kasih!

Selanjutnya kita bakal bahas common mistakes yang sering dilakuin pemula pas pake operators dan conditionals!

Common Mistakes

Common Mistakes Thumbnail and 9 more pages - Personal - Microsoft Edge 22_12_2025 16_33_03.png

Nah, setelah kita belajar banyak tentang operators dan conditionals, sekarang waktunya bahas kesalahan-kesalahan yang paling sering dilakuin sama pemula (dan kadang developer berpengalaman juga). Dengan tau kesalahan-kesalahan ini, kamu bisa avoid bug yang frustasi dan bikin code kamu lebih solid.

Mistake #1: Using == Instead of ===

Ini adalah kesalahan nomor satu yang paling sering terjadi. Banyak pemula yang pake == karena keliatan lebih simple (cuma dua karakter), padahal ini bisa bikin bug yang susah di-track.

// Bad: using loose equality
let userInput = "5";
let expectedValue = 5;

if (userInput == expectedValue) {
    console.log("Match!"); // Ini bakal jalan, padahal tipe datanya beda
}

Masalahnya, == melakukan type coercion yang bisa bikin hasil unexpected:

console.log("5" == 5);        // true (hah?)
console.log(0 == false);      // true (loh?)
console.log("" == false);     // true (kok bisa?)
console.log(null == undefined); // true (waduh)

Solusinya: selalu pake ===. Ini lebih strict dan predictable:

// Good: using strict equality
let userInput = "5";
let expectedValue = 5;

if (userInput === expectedValue) {
    console.log("Match!"); // Ini gak jalan, karena string != number
}

// Harus convert tipe data dulu
if (parseInt(userInput) === expectedValue) {
    console.log("Match!"); // Baru ini jalan
}

Dengan ===, kamu jadi lebih aware sama tipe data dan avoid bug subtle yang susah di-debug.

Mistake #2: Assignment vs Comparison

Ini adalah typo yang paling sering dan paling bahaya. Lupa nambah satu tanda = bisa bikin logic program kamu berantakan:

let isAdmin = false;

// Bug: assignment, bukan comparison!
if (isAdmin = true) {
    console.log("You are admin"); // Ini selalu jalan!
}

Yang terjadi di atas bukanlah comparison, tapi assignment. isAdmin = true bakal nge-set isAdmin jadi true, terus return true, jadi kondisinya selalu true.

Bug ini bahaya karena:

  1. Gak ada error message
  2. Code tetep jalan
  3. Hasilnya unexpected
  4. Susah di-detect

Solusinya:

// Good: proper comparison
if (isAdmin === true) {
    console.log("You are admin");
}

// Or even better: langsung pake boolean
if (isAdmin) {
    console.log("You are admin");
}

Tips Preventif:

  1. Biasakan pake strict equality === buat comparison
  2. Kalau pake ESLint atau linter lain, ini bakal ke-detect otomatis
  3. Pas code review, perhatiin kondisi yang aneh
  4. Test code kamu dengan berbagai kondisi

Mistake #3: Forgetting Break in Switch

Ini kesalahan klasik yang sering bikin hasil unexpected. Lupa pake break di switch statement bikin semua case dibawahnya ikut jalan (fall-through):

let grade = "B";

switch (grade) {
    case "A":
        console.log("Excellent!");
    case "B":
        console.log("Good job!");
    case "C":
        console.log("Not bad");
    case "D":
        console.log("Need improvement");
    default:
        console.log("Invalid grade");
}

// Output:
// Good job!
// Not bad
// Need improvement
// Invalid grade

Ini jelas bukan yang kita mau. Solusinya: selalu tambahin break:

let grade = "B";

switch (grade) {
    case "A":
        console.log("Excellent!");
        break;
    case "B":
        console.log("Good job!");
        break;
    case "C":
        console.log("Not bad");
        break;
    case "D":
        console.log("Need improvement");
        break;
    default:
        console.log("Invalid grade");
}

// Output: Good job!

Exception: Fall-through behavior bisa berguna kalau emang disengaja, misalnya:

let day = "Saturday";

switch (day) {
    case "Saturday":
    case "Sunday":
        console.log("It's weekend!");
        break;
    case "Monday":
    case "Tuesday":
    case "Wednesday":
    case "Thursday":
    case "Friday":
        console.log("It's weekday");
        break;
    default:
        console.log("Invalid day");
}

Tapi kalau pake fall-through, tambahin comment biar jelas ini disengaja:

switch (status) {
    case "pending":
        sendReminder();
        // fall through - intentional
    case "processing":
        updateStatus();
        break;
}

Mistake #4: Deep Nesting If/Else

Ini adalah kesalahan yang bikin code jadi susah dibaca dan di-maintain. Liat contoh yang jelek ini:

// Bad: pyramid of doom
function processOrder(order) {
    if (order) {
        if (order.items) {
            if (order.items.length > 0) {
                if (order.customer) {
                    if (order.customer.isVerified) {
                        if (order.payment) {
                            if (order.payment.isValid) {
                                // Finally do something
                                processPayment(order);
                            } else {
                                console.log("Invalid payment");
                            }
                        } else {
                            console.log("No payment info");
                        }
                    } else {
                        console.log("Customer not verified");
                    }
                } else {
                    console.log("No customer info");
                }
            } else {
                console.log("Empty order");
            }
        } else {
            console.log("No items");
        }
    } else {
        console.log("No order");
    }
}

Code di atas susah banget dibaca dan dipahami. Semakin dalam nesting-nya, semakin susah di-maintain.

Solusi: Early Return Pattern

Refactor pake early return buat bikin code lebih flat dan readable:

// Good: early return pattern
function processOrder(order) {
    // Check validasi di awal, return early kalau gak valid
    if (!order) {
        console.log("No order");
        return;
    }

    if (!order.items) {
        console.log("No items");
        return;
    }

    if (order.items.length === 0) {
        console.log("Empty order");
        return;
    }

    if (!order.customer) {
        console.log("No customer info");
        return;
    }

    if (!order.customer.isVerified) {
        console.log("Customer not verified");
        return;
    }

    if (!order.payment) {
        console.log("No payment info");
        return;
    }

    if (!order.payment.isValid) {
        console.log("Invalid payment");
        return;
    }

    // Main logic kalau semua validasi lolos
    processPayment(order);
}

Jauh lebih clean kan? Sekarang setiap validasi jelas dan code lebih linear.

Alternative: Extract Validation

Atau bisa extract validasi jadi function tersendiri:

function validateOrder(order) {
    if (!order) return "No order";
    if (!order.items || order.items.length === 0) return "Empty order";
    if (!order.customer) return "No customer info";
    if (!order.customer.isVerified) return "Customer not verified";
    if (!order.payment || !order.payment.isValid) return "Invalid payment";
    return null; // null = valid
}

function processOrder(order) {
    let error = validateOrder(order);

    if (error) {
        console.log(error);
        return;
    }

    processPayment(order);
}

Mistake #5: Overusing Switch Statement

Banyak pemula yang excited pas tau switch statement terus dipake kemana-mana. Padahal, switch gak selalu lebih baik dari if/else.

// Bad: switch untuk simple condition
let age = 20;

switch (true) {
    case age >= 18:
        console.log("Adult");
        break;
    default:
        console.log("Minor");
}

// Good: if/else lebih simple dan clear
if (age >= 18) {
    console.log("Adult");
} else {
    console.log("Minor");
}

Kapan Pake Switch:

  • Kamu ngecek satu variable dengan banyak nilai exact
  • Ada banyak case (5+ case)
  • Struktur lebih organized dengan switch

Kapan Pake If/Else:

  • Kondisi pake comparison operators (<, >, <=, >=)
  • Kondisi kompleks dengan logical operators
  • Cuma 2-3 kondisi
  • Kondisi pake range nilai

Contoh yang cocok switch:

// Good use of switch
function getHttpStatusMessage(code) {
    switch (code) {
        case 200:
            return "OK";
        case 201:
            return "Created";
        case 400:
            return "Bad Request";
        case 401:
            return "Unauthorized";
        case 404:
            return "Not Found";
        case 500:
            return "Internal Server Error";
        default:
            return "Unknown Status";
    }
}

Contoh yang lebih baik pake if/else:

// Better with if/else
function categorizeAge(age) {
    if (age < 13) {
        return "Child";
    } else if (age < 20) {
        return "Teenager";
    } else if (age < 60) {
        return "Adult";
    } else {
        return "Senior";
    }
}

Additional Common Mistakes

Mistake #6: Not Using Curly Braces

// Bad: no braces
if (condition)
    doSomething();
    doAnotherThing(); // This always runs!

// Good: always use braces
if (condition) {
    doSomething();
    doAnotherThing();
}

Mistake #7: Complex Conditions in One Line

// Bad: too complex
if (user.age >= 18 && user.hasLicense && (user.role === "admin" || user.role === "moderator") && !user.isSuspended) {
    // ...
}

// Good: break it down
let isAdult = user.age >= 18;
let hasLicense = user.hasLicense;
let hasModeratorRole = user.role === "admin" || user.role === "moderator";
let isActive = !user.isSuspended;

if (isAdult && hasLicense && hasModeratorRole && isActive) {
    // ...
}

Mistake #8: Not Considering Edge Cases

// Bad: not handling edge cases
function divide(a, b) {
    return a / b;
}

console.log(divide(10, 0)); // Infinity - not handled!

// Good: handle edge cases
function divide(a, b) {
    if (b === 0) {
        console.log("Cannot divide by zero");
        return null;
    }
    return a / b;
}

Best Practices Summary

  1. Always use === instead of ==
  2. Double check assignment vs comparison
  3. Always use break in switch (unless intentional fall-through)
  4. Use early return to avoid deep nesting
  5. Choose the right tool: if/else vs switch based on use case
  6. Always use curly braces even for single line
  7. Break complex conditions into readable chunks
  8. Handle edge cases and unexpected values
  9. Add comments for non-obvious logic
  10. Test your code with various inputs

Debugging Tips

Kalau kamu ketemu bug:

  1. Console.log is your friend - log kondisi dan nilai variable
  2. Use debugger - Chrome DevTools atau VSCode debugger
  3. Check operator - pastiin pake === bukan ==
  4. Check braces - pastiin kurung kurawal match
  5. Check break - pastiin ada break di switch
  6. Simplify - pecah kondisi kompleks jadi simple
// Debugging example
function checkEligibility(user) {
    console.log("Checking user:", user); // Debug point 1

    let isAdult = user.age >= 18;
    console.log("Is adult:", isAdult); // Debug point 2

    let hasPermission = user.role === "member";
    console.log("Has permission:", hasPermission); // Debug point 3

    if (isAdult && hasPermission) {
        console.log("Eligible!"); // Debug point 4
        return true;
    }

    console.log("Not eligible"); // Debug point 5
    return false;
}

Dengan memahami common mistakes ini, kamu bisa avoid bug yang frustasi dan nulis code yang lebih solid. Ingat, bahkan developer senior masih kadang bikin kesalahan-kesalahan ini, jadi gak usah minder kalau kamu juga ketemu bug. Yang penting adalah belajar dari kesalahan dan improve terus!

Selanjutnya, kita bakal masuk ke challenge praktis buat praktekin semua yang udah kita pelajari!

Challenge

JavaScript operators dan conditional statements - Claude and 8 more pages - Personal - Microsoft Edge 22_12_2025 16_34_08.png

Oke, saatnya praktek! Challenge kali ini simple: buat program yang nerima input umur terus tentuin status "Dewasa" atau "Anak".

Requirements

Buat dua versi solusi:

  • Versi 1: If/else statement
  • Versi 2: Ternary operator

Kriteria:

  • Umur < 18 tahun = "Anak"
  • Umur >= 18 tahun = "Dewasa"

Versi 1: Using If/Else Statement

Mari kita mulai dengan cara yang paling straightforward dulu. Ini adalah solusi menggunakan if/else:

// Challenge Version 1: If/Else Statement
function checkAge(age) {
    if (age >= 18) {
        return "Dewasa";
    } else {
        return "Anak";
    }
}

// Test cases
console.log(checkAge(25));  // Output: "Dewasa"
console.log(checkAge(17));  // Output: "Anak"
console.log(checkAge(18));  // Output: "Dewasa"
console.log(checkAge(5));   // Output: "Anak"

Solusi ini jelas dan mudah dipahami. Kondisinya simple: kalau umur lebih dari atau sama dengan 18, return "Dewasa", kalau nggak ya "Anak".

Versi 2: Using Ternary Operator

Sekarang kita bikin versi yang lebih concise menggunakan ternary operator:

// Challenge Version 2: Ternary Operator
function checkAgeShort(age) {
    return age >= 18 ? "Dewasa" : "Anak";
}

// Test cases
console.log(checkAgeShort(25));  // Output: "Dewasa"
console.log(checkAgeShort(17));  // Output: "Anak"
console.log(checkAgeShort(18));  // Output: "Dewasa"
console.log(checkAgeShort(5));   // Output: "Anak"

Versi ini lebih singkat tapi tetep readable. Karena kondisinya simple, ternary operator cocok dipake di sini.

Bonus Challenge: Enhanced Version

Mau tantangan lebih? Coba tambahin fitur ini:

1. Input Validation

function checkAgeValidated(age) {
    if (typeof age !== "number") return "Error: Input harus angka";
    if (age < 0) return "Error: Umur tidak boleh negatif";
    if (age > 150) return "Error: Umur tidak realistis";

    return age >= 18 ? "Dewasa" : "Anak";
}

2. Multiple Categories

function checkAgeCategory(age) {
    if (age < 5) return "Balita";
    if (age < 13) return "Anak";
    if (age < 18) return "Remaja";
    if (age < 60) return "Dewasa";
    return "Lansia";
}

Learning Points

Dari challenge ini, kamu seharusnya bisa:

  • Pake comparison operators (>=)
  • Bikin conditional logic dengan if/else
  • Gunain ternary operator buat shorthand
  • Validasi input sebelum diproses
  • Handle edge cases kayak umur boundary

Tips Solve Challenge

  • Start simple, solve versi basic dulu
  • Test dengan berbagai input termasuk edge cases
  • Validasi input user
  • Prioritaskan readability

Self-Check

  • [ ] Handle umur 17 (return "Anak")
  • [ ] Handle umur 18 (return "Dewasa")
  • [ ] Handle input negatif
  • [ ] Pake === bukan ==

What's Next?

Selamat! Kamu udah menyelesaikan materi Operators & Conditional. Sekarang kamu bisa:

  • Pake arithmetic, comparison, dan logical operators
  • Pahami truthy/falsy values
  • Bikin decision logic dengan if/else, switch, dan ternary
  • Avoid common mistakes

Next Episode: Loops

Di episode berikutnya, kita bakal belajar tentang Loops - cara melakukan operasi berulang dengan efficient. Kamu bakal belajar for loop, while loop, dan berbagai teknik iterasi lainnya.

Sebelum lanjut, pastiin kamu udah comfortable dengan semua konsep yang udah dibahas. Coba praktekin challenge di atas dengan berbagai variasi.

Practice makes perfect. Jadi buka text editor kamu dan mulai coding!

Sampai ketemu di episode berikutnya!

Happy coding!