JavaScript Switch Statement
The JavaScript switch statement is a control flow statement that is used to execute a block of code based on a matching case.
It is often used as an alternative to a series of if-else statements when there are multiple cases to consider.
Syntax:
switch (expression) {
case value1:
// code to be executed when expression matches value1
break;
case value2:
// code to be executed when expression matches value2
break;
...
default:
// code to be executed when none of the cases match expression
}
Explanation:
- This is the basic syntax of a switch statement.
- The
expressionis evaluated once and compared with the values of each case. - If there is a match, the code block associated with that case is executed.
- The
breakkeyword is used to exit the switch statement after a match is found. - If there is no match, the code block associated with the
defaultkeyword is executed.
The break Keyword
The break statement is used to exit the switch statement after a matching case has been found.
This prevents the execution of the code blocks for any subsequent cases.
As an example:
let color = "blue";
switch (color) {
case "red":
console.log("The color is red");
break;
case "blue":
console.log("The color is blue");
break;
case "green":
console.log("The color is green");
break;
default:
console.log("Unknown color");
}
In this example:
- When the
colorvariable is equal to "blue", the code block for the "blue" case is executed, and thebreakstatement exits the switch statement. - This prevents the execution of the code blocks for the "green" and default cases.
The default Keyword
The default keyword is used in a switch statement to specify the code that should be executed if none of the cases match the value of the expression being evaluated.
As an example:
let day = "Saturday";
switch (day) {
case "Monday":
console.log("Today is Monday");
break;
case "Tuesday":
console.log("Today is Tuesday");
break;
case "Wednesday":
console.log("Today is Wednesday");
break;
default:
console.log("Today is neither Monday, Tuesday, nor Wednesday");
}
In this example:
- If the value of the
dayvariable is not "Monday", "Tuesday", or "Wednesday", then the code block associated with thedefaultkeyword will be executed, and the output will be "Today is neither Monday, Tuesday, nor Wednesday".
Difference between == and === in javascript
When using a switch statement, it's common to use strict comparison (using the === operator) to compare the value of the switch expression with the cases in the switch statement.
This is because strict comparison checks both the value and the data type of the two operands being compared. In contrast, loose comparison (using the == operator) only checks the value of the operands, and can sometimes lead to unexpected results.
Here's an example of using strict comparison in a switch statement:
let value = 2;
switch (value) {
case 1:
console.log("The value is 1");
break;
case 2:
console.log("The value is 2");
break;
case 3:
console.log("The value is 3");
break;
default:
console.log("The value is not 1, 2, or 3");
}
In this example:
- The switch statement is comparing the
valueof the value variable with the cases using strict comparison. - When the value of
valueis equal to 2, the code block for thecase 2:is executed and the output will be "The value is 2".
Switch Basic Example
Here's a basic example of a switch statement in JavaScript:
let day = "Monday";
switch (day) {
case "Monday":
console.log("Today is Monday");
break;
case "Tuesday":
console.log("Today is Tuesday");
break;
case "Wednesday":
console.log("Today is Wednesday");
break;
default:
console.log("Today is neither Monday, Tuesday, nor Wednesday");
}
In this example:
- The switch statement is checking the value of the
dayvariable and executing different code blocks depending on the value. - If the value of
dayis "Monday", the code block associated with thecase "Monday":will be executed and the output will be "Today is Monday". - If the value of
dayis "Tuesday", the code block associated with thecase "Tuesday":will be executed and the output will be "Today is Tuesday". - If the value of
dayis "Wednesday", the code block associated with thecase "Wednesday":will be executed and the output will be "Today is Wednesday".