JavaScript Conditions

1. What are Conditional Statements?

Conditional statements are used to perform different actions based on different conditions. They allow your code to make decisions and execute specific blocks of code only when certain criteria are met.

In JavaScript, we have the following conditional statements:

2. The `if` Statement

The if statement is the most basic control flow statement. It evaluates a condition inside parentheses (). If the condition is truthy, the code block inside {} runs.

Syntax

if (condition) {
    // block of code to be executed if the condition is true
}

Example

let hour = 10;

if (hour < 12) {
    console.log("Good Morning!");
}
Output will appear here...

3. The `if...else` Statement

The else statement allows you to execute a block of code when the condition is false.

Syntax

if (condition) {
    // block of code to be executed if the condition is true
} else {
    // block of code to be executed if the condition is false
}

Example

let age = 16;

if (age >= 18) {
    console.log("You are eligible to vote.");
} else {
    console.log("You are not eligible to vote.");
}
Output will appear here...

4. The `else if` Statement

Use else if to specify a new condition if the first condition is false. You can chain multiple else if statements.

Syntax

if (condition1) {
    // code to be executed if condition1 is true
} else if (condition2) {
    // code to be executed if the condition1 is false and condition2 is true
} else {
    // code to be executed if the condition1 is false and condition2 is false
}

Example

let time = 15; // 3 PM

if (time < 12) {
    console.log("Good Morning");
} else if (time < 18) {
    console.log("Good Afternoon");
} else {
    console.log("Good Evening");
}
Output will appear here...

5. Nested if Statements

You can have if statements inside other if statements. This is useful for checking multiple dependent conditions.

let num = 20;

if (num > 10) {
    console.log("Greater than 10");
    if (num > 30) {
        console.log("Greater than 30");
    } else {
        console.log("But not greater than 30");
    }
}
Output will appear here...

6. The `switch` Statement

The switch statement is used to perform different actions based on different conditions. It is often a cleaner alternative to a long if..else if ladder when comparing a single variable against multiple values.

How it works:

Example

let day = 3;
let dayName;

switch(day) {
    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:
        dayName = "Saturday";
        break;
    case 7:
        dayName = "Sunday";
        break;
    default:
        dayName = "Invalid day";
}

console.log("Day is: " + dayName);
Output will appear here...

7. Comparison Table: if-else vs switch

Feature if-else switch
Usage Checking ranges or boolean conditions Checking discrete values (equality)
Expression Evaluates to true/false Evaluates to a value
Performance Can be slower for many conditions Generally faster for many fixed values
Flexibility High (can use logical operators) Low (only equality checks)
✅ Best Practice: Use switch when you are comparing a single variable against many known values. Use if-else for ranges (e.g., age > 18) or complex logic.

Practice Questions

Test your understanding of JavaScript Conditional Statements.

Easy

Q1: Check if a user is eligible to vote.

  • Declare a variable age and set it to 16.
  • Write an if...else statement to check if the age is 18 or greater.
  • Log "Eligible to vote" if true, or "Not eligible" if false.
Easy

Q2: Use the Ternary Operator for a quick check.

  • Declare a variable isRaining and set it to true.
  • Use the ternary operator to check the condition.
  • Log "Take an umbrella" if true, otherwise log "Wear sunglasses".
Medium

Q3: Write an if...else if...else chain to grade a student's score.

  • Store a score of 85 in a variable.
  • Print "A" if the score is 90 or above.
  • Print "B" if the score is 80 or above.
  • Print "C" for anything less than 80.
Medium

Q4: Convert an if...else block into a switch statement.

Convert the following logic into a switch statement:

let color = "red";
if (color === "red") {
    document.write("Stop");
} else if (color === "green") {
    document.write("Go");
} else {
    document.write("Unknown");
}
Hard

Q5: Write a nested conditional statement to check login credentials.

  • Assume variables: username = "admin" and password = "12345".
  • First, check if the username is "admin". If not, log "User not found".
  • If it is "admin", use a nested if to check if the password is "secret".
  • Log "Login successful" if the password matches, else "Wrong password".

Answer

Code: