Chapter 4: Conditional Statements

Master conditional statements like if, else if, and else to control the flow of your code based on conditions.

In this chapter, we’ll explore JavaScript conditional statements, which allow your code to make decisions based on certain conditions. These statements are essential for controlling the flow of your programs and making them responsive to different scenarios.

The `if` Statement

The if statement executes a block of code only if a specified condition is true. Here’s the basic syntax:

// Example: if statement
let temperature = 30;

if (temperature > 25) {
    console.log("It's a hot day!");
}

In this example, the message "It's a hot day!" will only be printed if temperature is greater than 25.

The `if-else` Statement

The if-else statement provides an alternative code block that executes if the condition is false. Here’s the syntax:

// Example: if-else statement
let age = 16;

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

In this example, if age is 18 or greater, the first message will print. Otherwise, the alternative message will be displayed.

The `if-else if-else` Statement

The if-else if-else statement allows for multiple conditions. Each condition is evaluated in order, and the first true condition will execute its corresponding code block:

// Example: if-else if-else statement
let score = 85;

if (score >= 90) {
    console.log("Grade: A");
} else if (score >= 80) {
    console.log("Grade: B");
} else if (score >= 70) {
    console.log("Grade: C");
} else {
    console.log("Grade: F");
}

In this example, the code evaluates each condition in turn. The first true condition will execute, and the rest are skipped.

Using Conditional Statements with Comparison Operators

Conditional statements are often used with comparison operators to create more complex conditions. For example:

// Example: if statement with comparison operators
let hoursWorked = 45;

if (hoursWorked > 40 && hoursWorked <= 60) {
    console.log("Overtime hours");
} else if (hoursWorked > 60) {
    console.log("Excessive hours");
} else {
    console.log("Standard hours");
}

In this example, the code checks if hoursWorked falls within specific ranges, allowing for customized responses based on the value.

The Ternary Operator

The ternary operator is a shorthand for simple if-else statements. It has the following syntax: condition ? expressionIfTrue : expressionIfFalse.

// Example: Ternary operator
let age = 20;
let status = (age >= 18) ? "Adult" : "Minor";
console.log(status);  // Outputs: Adult

In this example, the variable status is set to "Adult" if age is 18 or older, and "Minor" otherwise. The ternary operator is useful for making quick decisions in your code.

Nested Conditional Statements

Conditional statements can be nested within each other to create complex decision-making structures. Here’s an example:

// Example: Nested if statements
let age = 25;
let isMember = true;

if (age >= 18) {
    if (isMember) {
        console.log("Access granted: Adult member");
    } else {
        console.log("Access granted: Adult non-member");
    }
} else {
    console.log("Access denied: Minor");
}

In this example, the first if statement checks if the user is an adult, and the nested if checks if they are a member to determine specific access.

Summary and Next Steps

In this chapter, we covered conditional statements in JavaScript, including if, else if, else, the ternary operator, and nested conditions. These statements allow your code to make decisions, enhancing its flexibility. In the next chapter, we’ll explore loops, enabling your code to perform repeated actions efficiently.