<< PREVIOUS
NEXT >>

JavaScript Switch

About JavaScript Switch

In JavaScript, switch statement is a control flow statement which is used to execute a block of code based on the value of an expression or a variable.

It's often used as an alternative to multiple if-else statements to compare a single value against multiple cases.

The switch statement provides a more readable and organized way to handle multiple conditions compared to using multiple if...else if...else statements.

Switch Syntax

The switch statement evaluates an expression and executes the matching case block. The default block is executed when no match is found.

Basic Switch Syntax

Integral Parts of Switch

  • switch: The 'switch' keyword declares a switch statement and takes an expression as argument. The expression is a user-defined variable.
  • case: The 'case' keyword is used to define a condition or value that is checked against the expression provided in the switch. Each case value is compared against the switch expression. If a case matches, the block of code under the case will execute. Otherwise, the program flow will move to the next case until it reaches to the 'default' block.
  • break: The 'break' is used to prevent the program control flow from moving to the next case and exit from the switch statement. Without 'break', the code will continue executing subsequent cases (known as fallthrough behavior) until it encounters a break or the end of the switch.
  • default: The 'default' is used to execute a block of code if no case matches. It’s like the 'else' in an 'if-else' structure.

Creating a Switch

A switch can be defined using switch keyword followed by cases and default blocks. In the following example, the switch is used to find today's day name:

Example of Creating Switch
Explanation of the code
  • let day = new Date().getDay();: In this line, new Date().getDay() gets the day as number and the date number is assigned to the variable name 'day'.
  • switch (day): This line declares a switch using 'switch' keyword with variable 'day' as argument.
  • case 0:: Here 'case' keyword defines a condition with a value '0'. If 'day === 0' is true, the block of code under this case will execute. In this case, it will print 'Sunday' to the console.
  • break;: The 'break' will stop the switch statement.
  • The same logic applies to all other cases (case 1 to case 6). The program will check each case until it finds a match. If no match is found, the program flow will move to the 'default' block.
  • default:: The 'default' block will execute if no cases match. In this case, it will print 'It is not a day.'.

Type Checking in Switch (Advanced Level)

A switch uses strict equality (===) operator to compare expression value with case value for equality.

It doesn't perform type coercion using the loose equality operator (==). It requires both the type and value of the operands to be identical for the comparison to be true.

Example of Type Checking in Switch
Output of the above example
5 is a number type.

Grouping Cases (Advanced Level)

Multiple cases can be grouped together to execute a single block of code if they share the same logic.

Example of Grouping Cases in Switch
Output of the above example
Average Grades
Explanation of the code
  • case "A": case "B":: Here cases case "A": and case "B": are grouped together and they execute the same code 'console.log("Good Grades");'.
  • case "C": case "D":: Here cases case "C": and case "D": are grouped together and they execute the same code 'console.log("Average Grades");'.

Switch With Expressions (Advanced Level)

Expressions can be used in the case labels of switch statement. In the following example, the switch is used to determine the grade based on marks using expressions in the case labels.

Example of Using Expressions in Switch
Output of the above example
The grade is B
Explanation of the code
  • case marks < 80 && marks >= 70:: Here, case is followed by the expression marks < 80 && marks >= 70 instead of a single value.

Switch With Functions (Advanced Level)

Functions can also be used in the case labels of switch statement. In the following example, a function getGrade() is defined to determine the grade based on marks and then the function is called in the switch cases.

Example of Using Functions in Switch
Output of the above example
The grade is A

Switch with Advanced Conditions (Advanced Level)

Switch statement can also be used with advanced conditions. In the following example, the switch is used to check whether a number is even or odd using the modulus operator (%) in the case labels.

Example of Advanced Conditions in Switch
Output of the above example
7 is an odd number.
Explanation of the code
  • switch (number % 2): Here, the expression 'number % 2' is an example of advanced condition. It calculates the remainder when number is divided by 2. The remainder for an even number will be 0 and for an odd number will be 1.

JavaScript Compiler For Live Practice

Practice the above JavaScript code in the following JavaScript Editor. Create more JavaScript switch statements with different conditions in the following editor and click Execute button to check the output. The output will be displayed in JavaScript Code Output section.

JavaScript logo JavaScript Editor
JavaScript Code Output