JavaScript Conditions

IF / ELSE Conditions

// Basic syntax: if (condition) { ... }
let age = 18;

if (age >= 18) {
    console.log("You are an adult");
}

// if...else: execute alternative code
let temperature = 15;

if (temperature > 20) {
    console.log("It's hot");
} else {
    console.log("It's cold");
}

// Chain multiple conditions with else if
let grade = 85;

if (grade >= 90) {
    console.log("Excellent");
} else if (grade >= 80) {
    console.log("Very good");
} else if (grade >= 70) {
    console.log("Good");
} else if (grade >= 60) {
    console.log("Passable");
} else {
    console.log("Insufficient");
}

Comparison Operators

// Loose equality (==) vs strict equality (===)
console.log("--- Loose vs strict equality ---");
console.log(5 == "5");   // true - automatic conversion
console.log(5 === "5");  // false - different types

console.log(null == undefined);   // true
console.log(null === undefined);  // false

console.log(0 == false);   // true
console.log(0 === false);  // false

// TIP: always use === and !== to avoid surprises!

// Other comparison operators
let a = 10;
let b = 20;

console.log("--- Comparison Operators ---");
console.log(`${a} < ${b}: ${a < b}`);     // true
console.log(`${a} > ${b}: ${a > b}`);     // false
console.log(`${a} <= ${b}: ${a <= b}`);   // true
console.log(`${a} >= ${b}: ${a >= b}`);   // false
console.log(`${a} !== ${b}: ${a !== b}`); // true

Logical Operators

// && (logical AND) - all conditions must be true
let userLoggedIn = true;
let userAge = 25;

if (userLoggedIn && userAge >= 18) {
    console.log("Access granted");
}

// || (logical OR) - at least one condition must be true
let isAdmin = false;
let isModerator = true;

if (isAdmin || isModerator) {
    console.log("You can moderate content");
}

// ! (logical NOT) - reverses the value
let isInactive = false;

if (!isInactive) {
    console.log("The user is active");
}

Truthy and Falsy Values

// In JavaScript, some values are considered "falsy"
let falsyValues = [false, 0, "", null, undefined, NaN];

// All other values are "truthy"
console.log("--- Truthy Values ---");
let truthyValues = [true, 1, "hello", [], {}, "0", " "];

Ternary Condition

// Syntax: condition ? valueIfTrue : valueIfFalse
// It's a shortcut for simple if...else

let healthPoints = 75;
let healthStatus = healthPoints > 50 ? "Healthy" : "Injured";
console.log(`Status: ${healthStatus}`);

// Nested ternary (use with moderation)
let score = 85;
let mention = score >= 90 ? "Excellent" :
              score >= 80 ? "Very good" :
              score >= 70 ? "Good" : "Can do better";
console.log(`Mention: ${mention}`);

SWITCH / CASE

// Useful when comparing the same variable to multiple values
let dayOfWeek = "tuesday";

switch (dayOfWeek) {
    case "monday":
        console.log("Start of the week, stay strong!");
        break;
    case "tuesday":
    case "wednesday":
    case "thursday":
        console.log("Mid-week");
        break;
    case "friday":
        console.log("Almost the weekend!");
        break;
    case "saturday":
    case "sunday":
        console.log("Weekend!");
        break;
    default:
        console.log("Day not recognized");
}

// Example with numbers
let month = 3;
let monthName;

switch (month) {
    case 1: monthName = "January"; break;
    case 2: monthName = "February"; break;
    case 3: monthName = "March"; break;
    case 4: monthName = "April"; break;
    case 5: monthName = "May"; break;
    case 6: monthName = "June"; break;
    default: monthName = "Invalid Month";
}

console.log(`Month ${month}: ${monthName}`);

Short-circuit evaluation

// && can be used to execute code conditionally
let user = { nom: "Alice", estConnecte: true };
user.estConnecte && console.log(`Welcome ${user.nom}!`);
// Equivalent to: if (user.estConnecte) { console.log(`Welcome ${user.nom}!`); }

// || can be used to define default values
let userName = null;
let displayName = userName || "Guest";
console.log(`Hello ${displayName}!`);

// ?? (nullish coalescing) - only for null and undefined
let config = { theme: null };
let theme = config.theme ?? "light";
console.log(`Theme: ${theme}`);

// Difference between || and ??
let value1 = 0;
console.log("With ||:", value1 || "default");    // "default" (because 0 is falsy)
console.log("With ??:", value1 ?? "default");    // 0 (because 0 is neither null nor undefined)