Understanding JavaScript switch Statements - Simplify Multiple Condition Checks

Learn how to use the JavaScript switch statement to streamline conditional logic. The switch statement is ideal for executing one of multiple code blocks based on the outcome of a specified expression, making it an efficient alternative to complex if-else statements.

JavaScript switch Statement

The switch statement is a conditional control structure in JavaScript, similar to if statements. It’s especially useful when you want to execute one out of several possible blocks of code based on the return value of an expression.

Syntax

switch (expression or literal value) {
    case 1:
        // code to be executed
        break;
    case 2:
        // code to be executed
        break;
    case n:
        // code to be executed
        break;
    default:
        // default code to execute if no case matches
}

Use the break keyword to exit from a case block. Without break, the code will continue to the next case (known as "fall-through").

Example: Basic switch Statement

In this example, the switch statement evaluates a literal value and executes the matching case.

var a = 3;

switch (a) {
    case 1:
        alert("case 1 executed");
        break;
    case 2:
        alert("case 2 executed");
        break;
    case 3:
        alert("case 3 executed");
        break;
    default:
        alert("default case executed");
}

Displays: case 3 executed

Example: switch Statement with Expression

The switch can also evaluate an expression. The case that matches the result will be executed:

var a = 6;

switch (a / 2) {
    case 1:
        alert("case 1 executed");
        break;
    case 3:
        alert("case 3 executed");
        break;
    default:
        alert("default case executed");
}

Displays: case 3 executed

Example: switch with String Type Case

The switch statement can also use string values as case identifiers.

var person = "john";

switch (person) {
    case "steve":
        alert("This is Steve");
        break;
    case "bill":
        alert("This is Bill");
        break;
    case "john":
        alert("This is John");
        break;
    default:
        alert("Unknown Person");
}

Displays: This is John

Example: Combined switch Cases

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

var score = 2;

switch (score) {
    case 1:
    case 2:
    case 3:
        alert("Score is low");
        break;
    case 4:
        alert("Score is moderate");
        break;
    default:
        alert("Score is out of range");
}

Displays: Score is low

Points to Remember

• The switch statement is similar to an if statement but is more readable when dealing with multiple conditions.
• A switch statement evaluates either a literal value or an expression and includes multiple cases with executable code blocks.
• The break keyword is necessary to prevent fall-through to the next case.
• Multiple cases can be combined to execute the same code block, saving repetition.