Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Exploring JavaScript Conditionals!
You have completed Exploring JavaScript Conditionals!
Preview
Introduction to the switch statement
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
If you don't have your existing work
space open for this video, go ahead and
0:00
launch it now.
0:04
This switch statement is used for
multiple branching logic.
0:06
So let’s skip over our two way branch and
0:10
pull up the multi-way branch
an example for this video.
0:13
Remember, we signed a value
to a variable called day.
0:17
The we have several conditions for
the value.
0:22
Let's go ahead and
comment out all these lines.
0:25
So we can refer to it later and
it won't interfere with our work.
0:29
Switch is similar in some
ways to an if statement.
0:34
It has parentheses, followed by curly
braces, which holds a block of code.
0:39
The parentheses hold an expression.
0:46
In this case, it's an if statement.
0:48
Let's put in our variable day there,
and unlike an if statement,
0:52
all cases are contained inside one block
of code, marked out with the keyword case.
0:57
Let's write that case now.
1:05
We're saying to the JavaScript
interpreter consider the value
1:14
of day if equals 0,
execute this following block of code.
1:19
When it reaches the break statement,
1:25
it jumps out the entire block of code
to the next set of instructions.
1:27
Let's go ahead and
add the statement we want to run,
1:32
console.log ('Sunday').
1:35
Now that we have one branch here,
let's add another.
1:44
This is easy as simply copying and
pasting another case below.
1:48
Now our program has two branches
which can handle a 0, or a
2:00
1 value in day.
2:06
We can add as many cases
as we would like to.
2:10
We're going to add five more to
handle the rest of the week.
2:12
But first let me show you a common mistake
2:16
you might make when writing
a switch statement.
2:19
I'll remove the break
statement under Sunday.
2:22
If we set the date to equal 0,
and run the code,
2:26
you see it prints both Sunday and Monday.
2:33
If the break is missing,
the statement will fall through
2:37
to the next code, and
unexpected things can happen.
2:42
This is a reason why many developers
consider the switch statement
2:46
to be a bad choice to make when
branching inside a program and
2:50
isn't considered a best practice.
2:54
Let's add back the break.
2:57
And then add the rest of our branches.
3:01
Now we have seven branches for
any possible day of the week.
3:06
But what happens if a day value
is other than 0 through 6?
3:12
The switch statement also
provides a default option
3:18
to catch those possibilities.
3:23
This acts the way an else block acts,
in an if else statement.
3:26
Here's what it looks like.
3:33
Play with this a little bit now and
3:56
see how it works in the same way
as our initial if else statement.
3:58
That's really all there
is to a switch statement.
4:03
If you're testing against
the value of a single variable,
4:05
a switch statement saves you a lot of
typing with a lot of else if conditions.
4:09
Let's move on to another way to branch.
4:15
The ternary operator.
4:17
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up