JavaScript — Conditions

if — do this when

const temperature = 31;

if (temperature > 28) {
    console.log("It's hot — hydrate!");
}

The block runs only when the condition is truthy. Otherwise it's skipped entirely.

else — otherwise

if (temperature > 28) {
    console.log("Hot");
} else {
    console.log("Pleasant enough");
}

Exactly one of the two branches executes. Always.

else if — many-way branches

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

Checked top to bottom; the first true wins, rest are skipped. Ordering matters:

// BUG: everything ≥50 prints "Pass" before the A check is reached
if (score >= 50) { grade = "Pass"; }
else if (score >= 90) { grade = "A"; }   // unreachable for 95!

Put specific/most-demanding conditions first.

Combining conditions

if (age >= 13 && age <= 19) { /* teenager */ }
if (day === "Sat" || day === "Sun") { /* weekend */ }
if (!loggedIn) { showLogin(); }

Range checks need explicit bounds (&&), not math-style chaining.

Nesting — and why to limit it

// legal but smells:
if (user) {
    if (user.active) {
        if (user.role === "admin") { grantAccess(); }
    }
}

// flatter, kinder:
if (!user || !user.active || user.role !== "admin") return;
grantAccess();

Deep nesting hides logic; early exits keep code scannable.

Truthy shortcuts

Conditions coerce — no need for === true:

if (items.length) { … }     // 0 = falsy → skips empty list
if (inputValue) { … }       // "" skips

Ternary — one-line picker

const label = score >= 50 ? "Pass" : "Fail";

condition ? value-if-true : value-if-false. Ideal for choosing between two values; nested ternaries become unreadable — switch back to if.

switch vs else-if chains

Many comparisons against ONE value? switch reads cleaner:

switch (paymentMethod) {
    case "card":
        chargeCard(); break;
    case "paypal":
        redirectToPaypal(); break;
    default:
        showUnsupported();
}

Full treatment in its own lesson.

Common mistakes: = instead of === inside conditions; forgetting braces around multi-statement blocks; unreachable branches from wrong ordering.

Mini Practice

1. Grade classifier with correct ordering (test 95, 85, 75, 40)
2. Weekend detector using ||
3. Refactor triple-nested ifs into guard-clause version
4. Replace an if/else with a ternary; then nest one deliberately and feel why not
5. Break a condition with = instead of ===; observe always-true behavior

Next: loops → (next new topic: switch)