JavaScript Switch Case with 3 Examples

JavaScript Switch Case with 3 Examples

The Switch statement

The JavaScript switch statement comes where you have to decide to execute only specific code based on some condition(s).

We also learned how to use the if statement to execute code, based on certain condition(s), however, you should use the switch statement when you have a single variable to check for many different possibilities and execute the code accordingly.

See a basic switch case example

For example, your code checks the current date and executes code based on the number of a day of the Month. So, for up to 31 days of the month, you have a different block of code to execute for each day. One of the best ways to deal with this kind of scenario is using Javascript switch case. The Switch statement works with JavaScript case statement.

One of the best ways to deal with this kind of scenario is using Javascript switch case. The Switch statement works with JavaScript case statement.

In the following section, you will see examples of using switch JavaScript statement, let us first look at the general syntax.

Syntax of switch case

Following is the general syntax of switch case statement:

An expression is given in switch statement which is evaluated once. After that, the expression’s value is compared to each case value. If a match is found the code inside the case statement will be executed.

If none of the cases is matched the default part will be executed. Note that, you can give numbers or even characters in the case statement.

A JavaScript switch case example

Following is a simple JS switch example. The example simply assigns a value to the variable “a”. The variable a is then used as an expression in the switch case. Three cases are created with an alert for value 1,2 and 3.

If some other value is assigned to the variable a the default part will be executed.

Experience this example online

You can change the value of variable “a” other than 1 to execute other cases or 4,5…etc. for the default case.

A switch example with characters and chosen value

Following is a more generic example of the JavaScript switch case statement. This example uses characters rather numbers. A dropdown of colors is given in the example. Choose a color and after that

Choose a color and after that pressing the button will show an alert telling which color is chosen. It will also change the color of the paragraph’s text.

All this is done in the switch case. See the example online with code by clicking the link or image below.

JavaScript Switch statement

Experience this example online

Javascript break statement

As shown in above syntax and examples we used break statement inside the switch case. The break JavaScript statement will exit the switch statement as soon as it is executed.

The break statement is used inside the case statement. If you do not use break statement the code will keep on executing to match the following cases after the first case is matched. See what happens to above example without break statement.


Experience this example online

JavaScript default statement

The default section inside switch statement executes if none of the cases is matched. It is like the else statement in JS if..else.