JavaScript switch statement


The switch statement in JavaScript is a control structure used to execute different blocks of code based on the value of an expression. It's often used as an alternative to multiple if...else if statements when you need to test a variable or expression against multiple possible values.

Syntax

The basic syntax of the switch statement is:

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

How It Works

  1. Expression Evaluation: The switch statement evaluates the expression once.
  2. Case Matching: It then compares the result of the expression with the values in each case clause.
  3. Code Execution:
    • If a match is found, the corresponding block of code is executed.
    • If no match is found, the default block (if provided) is executed.
  4. Break Statement: The break statement is used to exit the switch statement. Without it, execution will continue to the next case (this behavior is known as "fall-through").

Example

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; case 6: console.log('Saturday'); break; case 7: console.log('Sunday'); break; default: console.log('Invalid day'); }
  • Explanation:
    • The switch statement evaluates the value of day.
    • If day is 3, it matches case 3, so 'Wednesday' is logged.
    • The break statement prevents execution from falling through to the next cases.
    • If day does not match any case, the default block logs 'Invalid day'.

Key Points

  1. Expression Value: The value of the expression is compared with each case value using strict equality (===). This means both the type and value must match.

  2. Break Statement: Use break to exit the switch statement. Omitting break results in fall-through, where code execution continues into the next case.

    let number = 2; switch (number) { case 1: console.log('One'); case 2: console.log('Two'); case 3: console.log('Three'); default: console.log('Other'); } // Output: // Two // Three // Other
    • Explanation:
      • Since break statements are missing, execution falls through from case 2 to case 3 and then to default.
  3. Default Case: The default block is optional and is executed if none of the case values match. It’s useful for handling unexpected or default cases.

  4. Multiple Cases: You can group multiple case values to handle them with the same code block.

    let fruit = 'apple'; switch (fruit) { case 'apple': case 'banana': console.log('This is a fruit.'); break; case 'carrot': console.log('This is a vegetable.'); break; default: console.log('Unknown item.'); }
    • Explanation:
      • Both 'apple' and 'banana' result in logging 'This is a fruit.'.

Summary

  • Control Flow: The switch statement is used for selecting one block of code to execute from multiple options based on the value of an expression.
  • Case Matching: It compares the expression value with each case value using strict equality.
  • Break Statement: Prevents fall-through by exiting the switch statement.
  • Default Case: Provides a fallback when no case matches the expression.