Skip to main content

JavaScript Switch Statement

By SamK
0
0 recommends
Category(s)
Topic(s)

In this tutorial, you will learn about the switch statement in JavaScript.

The switch statement is used to perform different actions based on different conditions. It provides an efficient way to execute a specific block of code depending on the value of an expression.

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 match is found
}

How It Works:

  • The switch expression is evaluated once.
  • Its value is compared with each case value.
  • If there is a match, the corresponding block of code executes.
  • If no match is found, the default block executes.

Example: Get Weekday Name

The getDay() method returns a number representing the weekday (0 for Sunday, 1 for Monday, etc.). The example below converts this number into a weekday name:

let day;
switch (new Date().getDay()) {
 case 0:
   day = "Sunday";
   break;
 case 1:
   day = "Monday";
   break;
 case 2:
   day = "Tuesday";
   break;
 case 3:
   day = "Wednesday";
   break;
 case 4:
   day = "Thursday";
   break;
 case 5:
   day = "Friday";
   break;
 case 6:
   day = "Saturday";
   break;
}
console.log("Today is: " + day);

// Output: Today is: Tuesday

The break Keyword

The break statement stops execution inside the switch block. If omitted, execution will fall through to the next case.

Without break

let fruit = "banana";
switch (fruit) {
 case "apple":
   console.log("You chose an apple.");
 case "banana":
   console.log("You chose a banana.");
 case "mango":
   console.log("You chose a mango.");
 default:
   console.log("Unknown fruit.");
}

// Output:
You chose a banana.
You chose a mango.
Unknown fruit.

Adding break prevents this issue

switch (fruit) {
 case "apple":
   console.log("You chose an apple.");
   break;
 case "banana":
   console.log("You chose a banana.");
   break;
 case "mango":
   console.log("You chose a mango.");
   break;
 default:
   console.log("Unknown fruit.");
}

// Output: You chose a banana.

The default Keyword

The default case executes if no other case matches:

let weather = "stormy";
switch (weather) {
 case "sunny":
   console.log("Wear sunglasses!");
   break;
 case "rainy":
   console.log("Take an umbrella.");
   break;
 default:
   console.log("Weather is unpredictable!");
}

// Output: Weather is unpredictable!

The default case does not have to be at the end:

switch (weather) {
 default:
   console.log("Weather is unpredictable!");
   break;
 case "sunny":
   console.log("Wear sunglasses!");
   break;
 case "rainy":
   console.log("Take an umbrella.");
   break;
}

Grouping Cases with Common Code

Multiple cases can share the same code block:

let dayNumber = new Date().getDay();
switch (dayNumber) {
 case 4:
 case 5:
   console.log("The weekend is near!");
   break;
 case 0:
 case 6:
   console.log("It's the weekend!");
   break;
 default:
   console.log("Waiting for the weekend!");
}

// Output: The weekend is near!

Strict Comparison (===)

The switch statement uses strict comparison (===).

let x = "0";
switch (x) {
 case 0:
   console.log("Zero as a number");
   break;
 case "0":
   console.log("Zero as a string");
   break;
 default:
   console.log("No match found");
}

// Output: Zero as a string

Since x is a string ("0"), it does not match the number 0 due to strict comparison.

Questions & Answers