Skip to main content

Archive

Show more

JavaScript Switch Statement

JavaScript Switch Statement

The switch statement in JavaScript is used to perform different actions based on different conditions. It provides a more readable and efficient way to compare a single expression against multiple possible values, compared to using multiple if...else if statements.


Basic Syntax of switch

The switch statement evaluates an expression and matches its value against a series of case clauses. If a match is found, the corresponding block of code is executed.

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 cases match
    break;
}

The break statement stops the execution of the switch block and prevents the next cases from being executed. The default clause is optional and is executed if none of the cases match the expression.


Example: Using switch Statement

Here is an example demonstrating how to use the switch statement:

const day = 'Tuesday';

switch (day) {
  case 'Monday':
    console.log('Start of the work week.');
    break;
  case 'Tuesday':
    console.log('Second day of the work week.');
    break;
  case 'Wednesday':
    console.log('Midweek day.');
    break;
  case 'Thursday':
    console.log('Almost there.');
    break;
  case 'Friday':
    console.log('Last day of the work week!');
    break;
  default:
    console.log('Enjoy the weekend!');
    break;
}
// Output: Second day of the work week.

In this example, the value of the day variable is compared against different cases. When a match is found (i.e., "Tuesday"), the corresponding code block is executed.


Using the default Case

The default case is executed if no matching case is found. It is similar to the else clause in an if...else statement:

const weather = 'stormy';

switch (weather) {
  case 'sunny':
    console.log('Wear sunglasses.');
    break;
  case 'rainy':
    console.log('Take an umbrella.');
    break;
  case 'cloudy':
    console.log('It might rain.');
    break;
  default:
    console.log('Check the weather forecast.');
    break;
}
// Output: Check the weather forecast.

Here, since "stormy" does not match any of the cases, the default case is executed.


Grouping Cases

You can group multiple cases together if they share the same code block:

const fruit = 'orange';

switch (fruit) {
  case 'apple':
  case 'orange':
  case 'banana':
    console.log('This is a fruit.');
    break;
  default:
    console.log('This is not a fruit.');
    break;
}
// Output: This is a fruit.

In this example, if the fruit variable matches any of the cases ('apple', 'orange', 'banana'), the same code block is executed.


Using switch with Range Values

While the switch statement does not support range values directly, you can achieve similar functionality using conditions inside the cases:

const grade = 85;

switch (true) {
  case (grade >= 90):
    console.log('Grade: A');
    break;
  case (grade >= 80):
    console.log('Grade: B');
    break;
  case (grade >= 70):
    console.log('Grade: C');
    break;
  case (grade >= 60):
    console.log('Grade: D');
    break;
  default:
    console.log('Grade: F');
    break;
}
// Output: Grade: B

By using switch (true), each case compares the condition with true, allowing for more complex comparisons.


Conclusion

The switch statement is a powerful tool for handling multiple conditions based on a single expression. It provides a cleaner and more readable alternative to using multiple if...else if statements, especially when dealing with a large number of conditions. Understanding how to use switch effectively can help improve the readability and efficiency of your code.

Comments