If else -

If the first if statement evaluates to true, then our code branches into the first
alert. If the first if statement is false, then our code evaluates the else
if statement to see if the expressions in it evaluate to a true or false. This
repeats until our code reaches the end. This repeats until our code reaches
the end. In other words, our code simply navigates down through
each if and else if statement until one of the expressions evaluates to true:
if (condition) {
...
} else if (condition) {
...
} else if (condition) {
...
} else if (condition) {
...
} else if (condition) {
...
} else if (condition) {
...
} else {
...
}

If none of the statements have expressions that evaluate to true, the code
inside the else block (if it exists) executes. If there is no else block, then the code
will just go on to the next set of code that lives beyond all these if statements.
Between the more complex expressions and if / else if statements, you can
represent pretty much any decision that your code might need to evaluate.

Switch Statements
In a world filled with beautiful if, else, and else if statements, the need for yet
another way of dealing with conditionals may seem unnecessary. People who
wrote code on room-sized machines and probably hiked uphill in snow (with
wolves chasing them) disagreed, so we have what are known
as switch statements. Using a Switch Statement
We are going to cut to the chase and look at the code first. The basic structure
of a switch statement is as follows:
switch (expression) {
case value1:
statement;
break;
case value2:
statement;
break;
case value3:
statement;
break;
default:
statement;
break;
}

The thing to never forget is that a switch statement is nothing more than a

conditional statement that tests whether something is true or false.
That something is a variation of whether the result of evaluating
the expression equals a case value.
Similarity to an If/Else Statement
At the beginning, we saw that a switch statement is used for evaluating
conditions - just like the if / else statement that we spent a bulk of our time on
here. Given that this is a major accusation, let's explore this in further detail by
first looking at how an if statement would look if it were to be literally translated
into a switch statement.
Let's say we have an if statement that looks as follows:
let number = 20;
if (number > 10) {
alert("yes");
} else {
alert("nope");
}

Because the value of our number variable is 20, our if statement will evaluate to

a true. Seems pretty straightforward. Now, let's turn this into a switch statement:
switch (number > 10) {
case true:
alert("yes");
break;
case false:
alert("nope");
break;
}

Notice that our expression is number > 10. The case value for the case blocks is
set to true or false. Because number > 10 evaluates to true, the code inside
the true case block gets executed. While your expression in this case wasn't as
simple as reading a color value stored in a variable like in the previous
section, our view of how switch statements work still hasn't changed. Our
expressions can be as complex as you would like. If they evaluate to
something that can be matched inside a case value, then everything is
golden...like a fleece!
Now, let's look at a slightly more involved example. This time, we will convert
our earlier switch statement involving colors into equivalent if / else statements.
The switch statement we used earlier looks as follows:
let color = "green";

switch(color) {
case "yellow":
alert("yellow color");
break;
case "red":
 alert("red color");
break;
case "blue":
alert("blue color");
break;
case "green":
alert("green color");
break;
case "black":
alert("black color");
break;
default:
alert("no color specified");
break;
}

This switch statement converted into a series of if / else statements would look

like this:
let color = "green";

if (color == "yellow") {
alert("yellow color");
} else if (color == "red") {
alert("red color");
} else if (color == "blue") {
alert("blue color");
} else if (color == "green") {
alert("green color");
} else if (color == "black") {
alert("black color");
} else {
alert("no color specified";
}
Deciding Which to Use
In the previous section, we saw how interchangeable switch statements
and if / else statements are. When we have two ways of doing something very
similar, it is only natural to want to know when it is appropriate to use one over
the other. In a nutshell, use whichever one you prefer. There are many
arguments on the web about when to use switch vs an if / else, and the one
thing is that they are all inconclusive.
My personal preference is to go with whatever is more readable. If you look at
the comparisons earlier between switch and if / else statements, you'll notice that
if you have a lot of conditions, your switch statement tends to look a bit cleaner.
It is certainly less verbose and a bit more readable. What your cutoff mark is
for deciding when to switch (ha!) between using a switch statement and
an if / else statement is entirely up to you. I tend to draw the line at around four
or five conditions.
Second, a switch statement works best when you are evaluating an expression
and matching the result to a value. If you are doing something more complex
involving weird conditions, value checking, etc., you probably want to use
something different. That could involve something even more different than
a if / else statement, by the way! We will touch upon those different
somethings later on.