JavaScript Switch Statement

What is a JavaScript Switch Statement?

The switch statement evaluates an expression and matches it with a case. If a match is found, the associated code block runs. If no match is found, the default block (if provided) executes.

Syntax

switch (expression) {
    case value1:
        // Code to execute if expression === value1
        break;
    case value2:
        // Code to execute if expression === value2
        break;
    default:
        // Code to execute if no case matches
}

• expression: The value to evaluate.
• case: Defines possible values for expression.
• break: Prevents the code from falling through to subsequent cases.
• default: (Optional) Runs when no case matches the expression.

Example 1: Basic Switch Statement

let day = 3;

switch (day) {
    case 1:
        console.log("Monday");
        break;
    case 2:
        console.log("Tuesday");
        break;
    case 3:
        console.log("Wednesday");
        break;
    case 4:
        console.log("Thursday");
        break;
    case 5:
        console.log("Friday");
        break;
    default:
        console.log("Weekend");
}
// Output: Wednesday

How the Switch Statement Works

1. The expression is evaluated once.
2. The value of expression is compared with each case.
3. If a match is found, the corresponding block of code runs.
4. The break statement ensures the program exits the switch block after executing the matched case.
5. If no case matches, the default block runs (if provided).

Example 2: Using Default

let fruit = "Apple";

switch (fruit) {
    case "Banana":
        console.log("Bananas are $1.00 per pound.");
        break;
    case "Apple":
        console.log("Apples are $1.50 per pound.");
        break;
    case "Orange":
        console.log("Oranges are $0.75 per pound.");
        break;
    default:
        console.log("Fruit not available.");
}
// Output: Apples are $1.50 per pound.

Example 3: Fall-Through Behavior

Without a break, cases fall through, meaning the next case’s code will also execute.

let grade = "B";

switch (grade) {
    case "A":
        console.log("Excellent!");
    case "B":
        console.log("Well done!");
    case "C":
        console.log("Good.");
        break;
    default:
        console.log("Try harder next time.");
}
// Output: 
// Well done!
// Good.

Fix Fall-Through: Always include break to avoid unintentional execution.

Example 4: Grouping Cases

You can group multiple cases to execute the same block of code.

let fruit = "Lime";

switch (fruit) {
    case "Orange":
    case "Lime":
    case "Lemon":
        console.log("Citrus fruit.");
        break;
    default:
        console.log("Other fruit.");
}
// Output: Citrus fruit.

Key Differences Between Switch and If…Else

Aspect	Switch	If…Else
Use Case	Best for comparing single expression with multiple values.	Flexible for complex conditions.
Syntax	Cleaner and more readable for fixed cases.	Can become cluttered with many conditions.
Performance	Slightly faster for many fixed values.	Performance depends on logic complexity.
Fall-Through	Cases fall through without break.	Each condition is independent.

Best Practices

1. Always Use Break: Prevent unintended fall-through by including a break after each case.
2. Use Default: Always include a default block to handle unmatched cases.
3. Simplify Conditions: Avoid using switch for complex conditions; stick to single value matching.
4. Group Similar Cases: Group related cases for cleaner code.

Common Mistakes

Omitting Breaks:

let color = "Red";

switch (color) {
    case "Red":
        console.log("Stop.");
    case "Yellow":
        console.log("Caution.");
    case "Green":
        console.log("Go.");
}
// Output: 
// Stop.
// Caution.
// Go.

1. Using Non-Unique Cases: Ensure each case has a unique value.
2. Complex Logic in Cases: Avoid nesting or complex expressions in cases. Use if…else for such scenarios.