The switch
conditional is a control structure in JavaScript that allows you to execute different blocks of code depending on the value of a variable or expression.
Sometimes it is used as a cleaner and more readable alternative to a series of nested if-else
statements. However, many people (myself included) believe that instead of improving readability, it usually worsens it.
If you want to learn more about the SWITCH conditional
check the Introduction to Programming Course read more ⯈
Basic Syntax
The basic syntax of a switch
conditional in JavaScript is as follows:
switch (expression) {
case value1:
// Code to be executed if expression is equal to value1
break;
case value2:
// Code to be executed if expression is equal to value2
break;
// ...
default:
// Code to be executed if expression does not match any case
break;
}
- expression: It is the expression whose value is evaluated in each case.
- case: Represents a specific value that is compared with the expression.
default
: Optionally, adefault
block can be included that will be executed if none of the cases match the value of the expression.
The default
block will be executed if none of the previous cases match the value of the expression. It is optional, but it is most common to have it.
Basic Example
Let’s take a look at an example of how switch
is used:
let number = 2;
switch (number) {
case 1:
console.log("One");
break;
case 2:
console.log("Two");
break;
case 3:
console.log("Three");
break;
default:
console.log("Invalid number");
break;
}
In this case, depending on the value of number
:
- 1, 2, and 3 will print the corresponding number on the screen.
- Any other number will display “Invalid number”.
Fall-Through between cases
Fall-Through is the possibility of “falling” from one case to another, and executing multiple code statements. Unlike other languages (such as C++), “fall-through” in JavaScript is intentionally limited.
In order to “fall” from one case to another, it is mandatory that the case
from which we are going to fall does not have statements.
Let’s see an example:
let fruit = "apple";
let color;
switch (fruit) {
case "apple":
case "pear":
case "kiwi":
color = "green";
break;
case "banana":
case "lemon":
color = "yellow";
break;
case "strawberry":
case "raspberry":
case "cherry":
color = "red";
break;
default:
color = "unknown";
}
console.log("The fruit " + fruit + " is " + color + " in color");
In this example, switch
is used to assign a color according to the given fruit. Several fruits are grouped under the same colors.
Practical Examples
Determine the name of a number
In this example, we use the switch
structure to determine the name of a number according to its value.
let number = 2;
switch (number) {
case 1:
console.log("One");
break;
case 2:
console.log("Two");
break;
case 3:
console.log("Three");
break;
default:
console.log("Invalid number");
break;
}
Determine the mathematical operation according to the operator
This code shows how to use a switch
to determine the mathematical operation according to the provided operator.
let operator = '+';
switch (operator) {
case '+':
console.log("Addition");
break;
case '-':
console.log("Subtraction");
break;
case '*':
console.log("Multiplication");
break;
case '/':
console.log("Division");
break;
default:
console.log("Invalid operator");
break;
}
Determine the name of a day of the week
This example shows how to determine the name of a day of the week using a switch
structure.
let day = 3;
switch (day) {
case 1:
console.log("Monday");
break;
case 2:
console.log("Tuesday");
break;
case 3:
console.log("Wednesday");
break;
// Add cases for the remaining days...
default:
console.log("Invalid day");
break;
}
Determine the name of a month
Here a switch is used to determine the name of a month according to its value.
let month = 5;
switch (month) {
case 1:
console.log("January");
break;
case 2:
console.log("February");
break;
case 3:
console.log("March");
break;
case 4:
console.log("April");
break;
case 5:
console.log("May");
break;
case 6:
console.log("June");
break;
case 7:
console.log("July");
break;
case 8:
console.log("August");
break;
case 9:
console.log("September");
break;
case 10:
console.log("October");
break;
case 11:
console.log("November");
break;
case 12:
console.log("December");
break;
default:
console.log("Invalid month");
break;
}
These examples are intended to show how to use the Switch conditional. It does not mean that it is the best way to solve the problem they address. There are usually better alternatives.