Introduction
Until now, your code ran top to bottom, every line, every time. Real programs decide: a big bill gets a discount, a small one does not; a correct password opens the door, a wrong one does not. The tool for decisions is the if statement — run this block only when the condition is true.
In this lesson you will build decisions with if and else, climb an else if ladder, walk through nested doors, take the ternary shortcut, and meet switch — the specialist for one value with many fixed options. You will also see the famous switch mistake live: forgetting break.
(Roman Urdu: if matlab "agar ye sach hai to ye karo" — code ab faislay karna seekh jayega.)
Key points
ifruns a block when the condition is true;elsecatches everything else. Two paths, exactly one runs: bill big enough → discount; otherwise → full price.- The
else ifladder checks in order — first match wins. Grading A, then B, then C, then fail: JavaScript tests from the top, runs the first true branch, and skips the rest. Order matters: put the highest grade first.(Roman Urdu: else if ki seerhi upar se neeche check hoti hai — jo pehle match ho jaye, wahi chalta hai.) - Nested if = two doors: an
ifinside anif— first door: logged in? second door: has a coupon? Both must open. Honest hint: often a single condition with&&does the same job more cleanly. - The ternary
?:is a one-line if/else:condition ? valueIfTrue : valueIfFalse— perfect for small choices like picking a label or a message. switchmatches ONE value against many fixed cases: the value is compared with eachcaseusing strict equality, and the matching block runs.(Roman Urdu: switch aik hi value ko bohat se fixed options se match karta hai.)breakends each case — forget it and you fall through: withoutbreak, JavaScript keeps running the next cases too, even though they do not match. This fall-through is the classic switch bug.- When each one wins: ranges, combos, and conditions →
if. One value, many fixed options →switch.
Code examples
Example 1 — The else if ladder: grading
let marks = 72;
let grade;
if (marks >= 80) {
grade = "A";
} else if (marks >= 60) {
grade = "B";
} else if (marks >= 40) {
grade = "C";
} else {
grade = "Fail";
}
console.log(grade);What it does: Marks are tested from the top. 72 is not >= 80, so the first branch is skipped. It is >= 60, so grade becomes "B" and the ladder stops — the C and Fail branches never run.
What you will see: one line in the Console: B. Change marks to 35 and run again — you will see Fail, because only the final else catches it.
Example 2 — switch, break, and the fall-through mistake
let day = 3;
let dayName;
switch (day) {
case 1:
dayName = "Monday";
break;
case 2:
dayName = "Tuesday";
break;
case 3:
dayName = "Wednesday";
break;
default:
dayName = "Unknown day";
}
console.log(dayName);What it does: The value 3 is matched strictly against each case. Case 3 matches, sets the name, and break exits the switch cleanly. The default case is the safety net for any value that matches nothing.
What you will see: one line in the Console: Wednesday. Now delete the break after case 3 and run again: the code falls through into default, and you will see Unknown day — that is the fall-through bug, live.
Example 3 — Two doors and the ternary shortcut
let isLoggedIn = true;
let hasCoupon = false;
let message;
if (isLoggedIn) {
if (hasCoupon) {
message = "Welcome! Coupon applied.";
} else {
message = "Welcome! No coupon found.";
}
} else {
message = "Please log in first.";
}
console.log(message);
let bill = 1200;
let label = bill >= 1000 ? "Big bill" : "Small bill";
console.log(label);What it does: Nested doors: the outer if checks login, the inner if checks the coupon — and here the second door stays shut, so the middle message wins. Below, the ternary makes the same kind of two-way choice in one line: is the bill at least 1000?
What you will see: two lines in the Console: Welcome! No coupon found. and then Big bill.
Quick recap
if/else if/else: checked in order, first match wins — built for ranges and combos.switch: one value, many fixed cases — and every case needs itsbreak, or you fall through.- Ternary
? := the one-line if/else for simple choices.
Common mistakes
- Wrong order in an else if ladder — checking
marks >= 40beforemarks >= 80means everyone passes into C and nobody reaches A. Fix: order conditions from highest to lowest; first match wins. - Forgetting
breakin switch — the code falls through and runs the following cases too, giving wrong results that look mysterious. Fix: end every case withbreak(unless you truly want fall-through). - Using switch for ranges —
switchonly matches exact values, socase marks >= 80does not do what beginners expect. Fix: ranges and combos belong toif;switchis for one value with fixed options.
Practice
- Write a login check: if the username is
"admin"and the password is"chai123", printLogin successfulin green style text on a small page; otherwise printWrong details— use anifwith&&and set the message colour withstyle.color. - Build a
switchthat takes a number from 1 to 3 and prints a drink name for each (1 = Chai, 2 = Coffee, 3 = Lassi), with adefaultfor other numbers. Then remove onebreak, run it, and write down what fall-through did.