Conditional Statements (if, else if, switch & Guard Clauses)

🟨 JavaScript (ES2026+) 🟢 Lesson 7 📂 Phase 04: Conditions 📅 2026 Edition

📌 Covered in this lesson: if · else · else if · Nested Conditions · Multiple Conditions · Logical Conditions · Ternary · switch · case · break · default · Guard Clauses · Truthy/Falsy · 6 Practice Programs

Welcome to Phase 4: Conditions! Conditional statements allow your JavaScript applications to make intelligent decisions based on changing data. In this masterclass guide, you will master single if branches, else if decision ladders, nested conditions, multi-condition logic with && and ||, ternary expressions, clean switch-case statements, modern Guard Clauses, and solve 6 real-world practice programs.

1if, else, and else if Decision Ladders

JavaScript lo code execution branching cheyyadaniki if, else if, mariyu else blocks vadathamu:

1. if Statement

Given condition true aythe mathrame block lopali code execute avthundhi.

2. else if Ladder

Multiple conditions ni sequential ga step-by-step check cheyyadaniki vadathamu.

3. else Fallback

Painunna conditions anni false ayinappudu default ga execute avthundhi.

JavaScript — Marks Grading Example ▶ Run Code

"use strict";

const marks = 78;

if (marks >= 90) {
    console.log("Grade A");
} else if (marks >= 60) {
    console.log("Grade B");
} else if (marks >= 40) {
    console.log("Grade C");
} else {
    console.log("Fail");
}

2Nested Conditions & Multiple Logical Conditions

Oka if block lopala maroka if block rayadanni Nested Condition antaru. Rendunte ekkuva conditions ni combine cheyyadaniki logical && (AND), || (OR), and ! (NOT) vadathamu:

JavaScript — Multiple & Nested Conditions ▶ Run Code

"use strict";

let age = 22;
let hasVoterId = true;
let isCitizen = true;

// Multiple conditions combined with &&
if (age >= 18 && hasVoterId && isCitizen) {
    console.log("✅ Eligible to Vote in Elections!");
} else {
    // Nested inspection
    if (age < 18) {
        console.log("❌ Underage: You must be at least 18 years old.");
    } else {
        console.log("❌ Missing Voter ID or Citizenship documents.");
    }
}

3Guard Clauses (Early Return Clean Code Pattern)

Deep ga nested if-else blocks rayadam valla code readability padipothundi (called Pyramid of Doom). Guard Clauses tho invalid cases ni mundhugane check chesi early ga return chesi code ni clean ga unchavachu:

JavaScript — Guard Clause Pattern ▶ Run Code

"use strict";

function processPayment(user, amount) {
    // Guard Clause 1: Invalid user check
    if (!user) {
        return "Error: User profile not found!";
    }

    // Guard Clause 2: Negative amount check
    if (amount <= 0) {
        return "Error: Payment amount must be greater than zero!";
    }

    // Guard Clause 3: Insufficient balance check
    if (user.balance < amount) {
        return "Error: Insufficient funds in account!";
    }

    // Happy Path — Clean and Flat!
    user.balance -= amount;
    return "Success: Transferred Rs." + amount + " | New Balance: Rs." + user.balance;
}

const account = { name: "Ravi", balance: 5000 };
console.log(processPayment(account, 1200));

4switch, case, break & default

Oka variable value ni multiple fixed constants tho compare cheyyadaniki switch statement best choice. break statement lekunte execution kindha unna cases loki fall-through avthundhi:

JavaScript — switch Statement ▶ Run Code

"use strict";

let dayNumber = 3;
let dayName;

switch (dayNumber) {
    case 1:
        dayName = "Monday";
        break;
    case 2:
        dayName = "Tuesday";
        break;
    case 3:
        dayName = "Wednesday";
        break;
    case 4:
        dayName = "Thursday";
        break;
    case 5:
        dayName = "Friday";
        break;
    case 6:
    case 7:
        dayName = "Weekend (Saturday/Sunday) 🎉";
        break;
    default:
        dayName = "Invalid Day Number (1-7 allowed)";
}

console.log("Day " + dayNumber + " is: " + dayName);

5Truthy/Falsy in Conditions & Safe Comparisons

Condition lo pure boolean kakunda string or object pettinappudu JS implicit truthiness evaluate chesthundi. Eppudu strict === vadatam dwara accidental string-to-number coercions ni prevent cheyyavachu:

let username = "Ravi";
if (username) {
    console.log("Hello, " + username); // Executes because non-empty string is Truthy!
}

6Practice Programs (6 Complete Solutions)

Mastering conditions through 6 practical algorithms:

Program 1: Even or Odd Checker

JavaScript — Even or Odd ▶ Run Code

"use strict";

let num = 47;
if (num % 2 === 0) {
    console.log(num + " is EVEN");
} else {
    console.log(num + " is ODD");
}

Program 2: Largest of Three Numbers

JavaScript — Largest of Three ▶ Run Code

"use strict";

let a = 85, b = 92, c = 74;

if (a >= b && a >= c) {
    console.log("Largest Number is: " + a);
} else if (b >= a && b >= c) {
    console.log("Largest Number is: " + b);
} else {
    console.log("Largest Number is: " + c);
}

Program 3: Voting Eligibility Checker

JavaScript — Voting Eligibility ▶ Run Code

"use strict";

let voterAge = 19;
let message = voterAge >= 18 
    ? "✅ Eligible to Vote!" 
    : "❌ Not Eligible (Wait " + (18 - voterAge) + " more years)";

console.log(message);

Program 4: Full Grade Calculator

JavaScript — Grade Calculator ▶ Run Code

"use strict";

function calculateGrade(score) {
    if (score < 0 || score > 100) return "Invalid Score!";
    if (score >= 90) return "A+ (Outstanding)";
    if (score >= 80) return "A (Excellent)";
    if (score >= 70) return "B (Good)";
    if (score >= 60) return "C (Average)";
    if (score >= 40) return "D (Pass)";
    return "F (Fail)";
}

console.log("Score 95:", calculateGrade(95));
console.log("Score 78:", calculateGrade(78));
console.log("Score 35:", calculateGrade(35));

Program 5: Leap Year Checker

JavaScript — Leap Year Checker ▶ Run Code

"use strict";

function isLeapYear(year) {
    // Leap year rule: divisible by 4 AND not 100, OR divisible by 400
    if ((year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0)) {
        return year + " is a LEAP YEAR 🗓️";
    }
    return year + " is NOT a leap year";
}

console.log(isLeapYear(2024)); // Leap year
console.log(isLeapYear(2026)); // Not leap year
console.log(isLeapYear(2000)); // Leap year (divisible by 400)
console.log(isLeapYear(1900)); // Not leap year (century not divisible by 400)

Program 6: Simple Calculator using switch

JavaScript — Calculator using switch ▶ Run Code

"use strict";

function calculate(n1, operator, n2) {
    let result;
    switch (operator) {
        case '+':
            result = n1 + n2;
            break;
        case '-':
            result = n1 - n2;
            break;
        case '*':
            result = n1 * n2;
            break;
        case '/':
            result = n2 !== 0 ? n1 / n2 : "Error: Cannot divide by zero!";
            break;
        case '%':
            result = n1 % n2;
            break;
        default:
            result = "Error: Unknown operator!";
    }
    return n1 + " " + operator + " " + n2 + " = " + result;
}

console.log(calculate(10, '+', 5));
console.log(calculate(20, '*', 3));
console.log(calculate(15, '/', 4));
console.log(calculate(10, '/', 0));

💻 Try It Yourself — Complete Challenge

Run and inspect the combined grade evaluation program in our live compiler:

JavaScript Conditions ▶ Run Code

"use strict";

const studentName = "Ravi";
const marks = 78;

let grade;
if (marks >= 90) {
    grade = "Grade A";
} else if (marks >= 60) {
    grade = "Grade B";
} else if (marks >= 40) {
    grade = "Grade C";
} else {
    grade = "Fail";
}

console.log("Student:", studentName);
console.log("Marks:", marks);
console.log("Result:", grade);

Run Code in Our Compiler →

Written and reviewed by Our Compiler Technical Team · Updated for JavaScript ES2026+