• JavaScript Basics

  • Operators in JavaScript

  • Conditional Statements in JavaScript

  • JavaScript Strings

  • JavaScript Arrays

  • JavaScript Loop

  • JavaScript Functions

  • Conclusion

JavaScript Switch Statement

Switch Statement in JavaScript

JavaScript switch statement helps control the flow of your program by selecting one of many code blocks to execute based on the value of an expression. This is especially useful when you have multiple potential values to check, making your code more organized and readable.

How the JavaScript Switch Statement Works

The switch statement evaluates an expression, compares its value against several predefined cases, and executes the code block that matches the case. If no cases match, the default block is executed.

Syntax:

javascript
1switch(expression) {
2  case value1:
3    // code block
4    break;
5  case value2:
6    // code block
7    break;
8  default:
9    // code block for when no cases match
10}

Example 1: Outfit Based on the Weather

Let’s imagine you want to pick an outfit based on the weather. Here’s how the switch statement could help:

javascript
1let weather = "sunny";
2let outfit;
3
4switch (weather) {
5  case "sunny":
6    outfit = "Wear a t-shirt and shorts.";
7    break;
8  case "rainy":
9    outfit = "Take a raincoat and boots.";
10    break;
11  case "snowy":
12    outfit = "Put on a heavy coat and gloves.";
13    break;
14  default:
15    outfit = "Just wear something comfortable.";
16}

If the weather is "sunny", the chosen outfit will be:

javascript
1Wear a t-shirt and shorts.

Example 2: Beverage Based on Temperature

Let’s decide on a drink based on how warm or cold it is:

javascript
1let temperature = "hot";
2let drink;
3
4switch (temperature) {
5  case "hot":
6    drink = "Have some iced lemonade.";
7    break;
8  case "cold":
9    drink = "Warm up with a hot chocolate.";
10    break;
11  case "mild":
12    drink = "Maybe enjoy a refreshing iced tea.";
13    break;
14  default:
15    drink = "Drink water to stay hydrated.";
16}

If the temperature is "hot", the drink choice will be:

javascript
1Have some iced lemonade.

Example 3: Select a Mode of Transport Based on Distance

Suppose you need to choose a way to travel based on distance:

javascript
1let distance = "long";
2let transport;
3
4switch (distance) {
5  case "short":
6    transport = "Walk or ride a bike.";
7    break;
8  case "medium":
9    transport = "Take a bus or drive a car.";
10    break;
11  case "long":
12    transport = "Book a flight.";
13    break;
14  default:
15    transport = "Stay home and relax!";
16}

If the distance is "long", the chosen mode of transport will be:

javascript
1Book a flight.

Switch Key Takeaways

  1. break Keyword: Each case ends with break to prevent the code from continuing to the next case. Without break, JavaScript will continue running through the next cases even if they don’t match.
  2. default Keyword: The default block is a backup plan. If none of the cases match, the code inside the default block runs.
  3. Strict Comparison: Switch cases use strict comparison (===). If the types don’t match, even if the values do, they won’t match.

Frequently Asked Questions