Hi guys, welcome back, in this tutorial, I am going to discuss the JavaScript switch statement. In the previous module, we have studied conditional statements in JavaScript. So, without any delay, let’s begin and know the switch statement.
JavaScript Switch Statement
Like if and if-else statements, the switch statement in JavaScript is also a conditional statement, which means that the statement will execute depending upon the condition or expression.
Syntax
switch(expression) { case constant1: statement(s) break; case constant2: statement(s) break; ……… ……… case constant: statement(s) break; default: statement(s) }
An expression can be a number, string, or character.
let a=2; switch(a) { case 1: console.log("One"); break; case 2: console.log("Two"); break; default: console.log ("Wrong Choice!"); } //Output //Two
Flow chart of the switch statement
The default block is optional. The statements or code corresponding to the default block will be executed only when none of the cases matches. Suppose in the above example, if a=3, we will get the Wrong Choice! as output.
let a=3; switch(a) { case 1: console.log("One"); break; case 2: console.log("Two"); break; default: console.log ("Wrong Choice!"); } //Output //Wrong Choice!
The break keyword is also optional. The switch block terminates as soon as the break statement is reached and the control flow of the program jumps to the statements immediately following the switch block. If we do not write a break keyword then all the cases will be executed.
let num=3; switch(num) { case 1: console.log("One"); case 2: console.log("Two"); case 3: console.log("Three"); case 4: console.log("Four"); case 5: console.log("Five"); case 6: console.log("Six"); case 7: console.log("Seven"); default: console.log ("Wrong Choice!"); } //Output //Three //Four //Five //Six //Seven //Wrong Choice!
In the above example, you might be surprised why we are getting output other than Three, this is because there is no break keyword so all the remaining cases will also be executed after case 3. So, be careful to use the break keyword in a switch statement, otherwise, we will be getting the wrong output.
The break is not used in the default block because the flow of control will automatically come out of the switch after the default is executed.
Why use switch statement in JavaScript?
You might be thinking about why to use a switch statement if we have an if-else statement in JavaScript. So, let’s discuss.
If multiple if-else statements are used in the program, then the program might become difficult to understand and read. The programmer might get confused. So, to overcome the same problem, we need to use the switch statement to make our program easy to read and understand. The switch statement is an alternative to if-else-if statements.
const ch=3; if(ch==1) console.log("Today in Monday "); else if(ch==2) console.log("Today in Tuesday "); else if(ch==3) console.log("Today in Wednesday "); else if(ch==4) console.log("Today in Thursday "); else if(ch==5) console.log("Today in Friday "); else if(ch==6) console.log("Today in Saturday "); else if(ch==7) console.log("Today in Sunday "); else console.log("Wrong Choice!"); //Output //Today is Wednesday
The above program can be done using a switch statement.
const ch=3; switch(ch) { case 1: console.log("Today is Monday"); break; case 2: console.log("Today is Tuesday"); break; case 3: console.log("Today is Wednesday");break; case 4: console.log("Today is Thursday");break; case 5: console.log("Today is Friday");break; case 6: console.log("Today is Saturday");break; case 7: console.log("Today is Sunday");break; default: console.log("Wrong Choice!"); } //Output //Today is Wednesday
We can also use an expression in place of a condition.
const n=201; switch(n%2) { case 0: console.log ("201 is an even number."); break; case 1: console.log ("201 is an odd number."); break; } //Output //201 is an odd number.
Nested switch statement
Like nested if-else, we can also use nested switch statements in our program.
let a=1; const ch='-'; undefined switch(a) { case 1:console.log("One"); switch(ch) { case '+': console.log("Sum",12+7); break; case '-': console.log("Difference",12-7); break; } case 2: console.log("Two"); break; default: console.log("Wrong Choice"); } //Output //One //Difference 5 //Two
I hope you liked this module and understood what is switch statement in javascript and why to use it. Stay connected with us for more modules like this. Until then, keep practicing!