When is comes to controlling the flow of a particular program with making decision, there are typically two options we have:
- if…else
- switch case
In our previous article we had covered everything you need to know about the if..else in JavaScript. Here is the link:
Now let's explore the switch case statement.
Check out this simple example:
let fruit = "apple";
switch (fruit){
case "apple":
console.log("This is an apple");
break;
case "mango":
console.log("This is a mango");
break;
default:
console.log("This is a fruit");
}
// Output:
This is an apple
In case if you are not familiar with switch
before, then it's a fairly simple procedure to control a flow of a program.
Here is a typical syntax of switch
:
switch(expression_to_be_checked){
case first_value:
//do something
break;
case second_value:
//do something else
break;
case third_value:
//do something else
break;
default:
// do what not defined in above cases
}
Let's breakdown the syntax:
every
switch
statement start with aswitch
keyword which hold an expression to be checked either as avalue
or as avariable
then we have several
cases
to check the expression, and do a particular task according to thecase
in every
case
block we have abreak
keyword. It is used to break the further flow of the program and limit us to execute task of a particular case blockat the end we have a
default
case. It executes the default task if no case condition is satisfies.
There you have it the switch case statement in JavaScript.
But, it's not gonna end here, there are few important points you need to aware of before using it.
You can put the default
keyword wherever you want; not necessary to put at the end
Everywhere you'll find that the default
keyword has been put at the end of every required case
block, but it's not necessary to put default
at the end.
In-fact I prefer putting the default at the beginning, because it make me feel comfortable to not worry about any further if I use lot of case
block.
Either way it's a subjective matter, so you put it where you want, it's not a big deal.
let animal = "mouse";
switch (animal){
default:
console.log("This is an animal");
case "rabbit":
console.log("This is an rabbit");
break;
case "lion":
console.log("This is a lion");
}
// Output:
This is an animal
In-fact I don't need to put
break
at the last case block, because it makes sense, it's the last case and no othercase
is going to be checked after the last case block
Not every switch statement require a default case.
Yeah you read it right. It's not mandatory to use default in every switch
statement. You may have condition where you wouldn't need to use default
case.
let animal = "mouse";
switch (animal){
case "rabbit":
console.log("This is an rabbit");
break;
case "lion":
console.log("This is a lion");
}
// Output:
you might not able to see anything as output
What if you forgot to use break
keyword
It's fairly simple answer - All the case block would be executed whether the condition meets or not - Simple.
Let me comment out the break
keyword.
let fruit = "guava";
switch (fruit){
case "apple":
console.log("This is an apple");
//break;
case "mango":
console.log("This is a mango");
//break;
default:
console.log("This is a fruit");
}
// Output:
This is an apple
This is a mango
Not using
break
keyword can leads to a new experience as well. It's called multi-case operation.
Check this out:
let fruit = "guava";
switch (fruit){
case "apple":
case "mango":
case "pineapple":
case "guava":
case "watermelon":
console.log("This is a fruit");
break;
default:
console.log("This is a thing");
}
//Output
This is a fruit.
It's also known as fall-through.
Here we use the four case statement perform the same task.
Conclusion:
So this is all you need to know to work with switch
case. Sometimes switch statement is used as a alternative of if…else
. But they have their own use cases.
It's also seen that switch
statement work faster than if…else
in most cases if there are too many conditions to be checked.
I've illustrated several example and scenarios to explain switch statement, but I would highly recommend to tweak with your own example to have a better understanding.
Cause as they say practice makes perfection.
Thanks for sticking around. Keep Learning.
This article is officially published on Within Bracket
Top comments (0)