Javascript Switch Statement – Understanding The Concept Of Switch

Javascript Switch Statement?

In the previous article, we learn about else if statement. In this tutorial, we will learn about the javascript switch statement in a simple way.

The else if statement can execute a series of conditions in a row. But, the major drawback from the else if statement is, the javascript interpreter must evaluate each if condition until it reaches the desired condition.

For example, you need to evaluate 100 conditions. In this case, it was wasteful to repeatedly evaluates an expression in multiple if statements.

But, you can overcome this situation using a javascript switch statement.

The javascript switch statement executes one of many blocks of code by comparing the value of switch expression.

In the switch statement, there is no need for executing multiple conditions. But still, we can execute one of many blocks of code.

Before going to understand the functionality of a switch, take a look at on switch syntax. Otherwise, it will be difficult to understand.

Syntax :

switch(expression){
  case n:
     //code bloack
  break;
  case n2:
     // code block
  break;
  case n3:
     // code block
  break;
  default:
     // code block;
}

Explanation :

A switch statement is a group of code blocks. Each code block is started with the keyword case and ends with break and it also has the default code block.

The default code block doesn’t have the break statement.

In the above example, the expression is the condition which is to be evaluated and n1n2n3 are the targeted values.

The switch statement first evaluates the expression. Then it will compare the result with the case values.

If the resulted value matched with any of the case values, that block will be executed.

If none of the case values matched, the default block will be executed.

For better understanding see the picture below.

flowchart for javascript switch statement

Example:

var day = 5;
 switch(day){
   case 2:   // compares 2===5
      console.log("First Day");
   break;
   case 3:   // compares 3===5
      console.log("Third Day");
   break;
   case 5:   // compares 5===5
      console.log("Fifth Day");
   break;
   default:
      console.log("value not matched");
 }

//expected output - Fifth day

How does the above code work?

We pass the variable day in a switch. First, the interpreter compares the value of day with all the case values.

If the matched case value found, that block will be executed. If none of the case values matched the default block will be executed.

The output for the above code is

Fifth day

Ok. That’s it for the javascript switch statement. Hoping! now you understand the concept of a switch statement.

Note: It always a good idea to use the switch statement when dealing the code with a large number of conditions.

If you have any doubts feel free to comment below and if you like this article, please share with your friends.

Thanks for reading!

keep [email protected]

Was this post helpful?
Let us know if you liked the post. That’s the only way we can improve.
Yes0
No0
Powered by Pixelbart

Leave a Reply

Your email address will not be published. Required fields are marked *