Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
See how to implement one possible solution this conditional statement challenge.
Provide feedback
We're looking for feedback on this new type of practice workshop. When you're finished, could you please review the workshop by filling out this short form?
How did it go?
0:00
If you didn't get it to work,
you can watch my solution
0:01
compared to what you wrote and
then try to recreate it yourself.
0:04
Also, keep in mind,
0:07
there are usually many different ways
to solve a programming challenge.
0:08
Your solution may be different than
mine and still work, that's fine.
0:12
So the first thing that I'll do is I'll
move the declarations for the num2 and
0:15
message variables to the top
of the math.js file.
0:20
I'll also remove the var
keywords from down below.
0:23
This practice session requires that
you use a conditional statement.
0:30
But where should you put it?
0:33
Let's look at the requirements again.
0:35
I'm supposed to check the values of
the inputs, are they numbers or not?
0:39
So I can put the conditional statement
right after I collect input from the user.
0:43
So I start with the if clause,
followed by a condition in parentheses,
0:52
and braces to mark the opening and
closing of the conditional.
0:56
Anything I add in here will run
only if number 2 is equal to 0.
1:00
I'll add an alert Message.
1:05
Let's see how this works,
I'll save and preview the file.
1:10
Type a number for the first input,
and 0 for the second.
1:19
Excellent, here's the alert.
1:23
Uh-oh, unfortunately,
it still prints to the page,
1:26
that's because the rest of the program
is outside of the conditional statement.
1:29
We need to add an else clause to stop
the programming from generating and
1:34
writing this message.
1:37
I'll add an else clause and
another set of brackets.
1:39
Okay, I'll save the file and
preview again.
1:57
Great, I get the alert message,
but nothing is printed to the doc,
2:05
that's perfect.
2:08
But I also want to check that
both inputs are numbers.
2:09
I can add a branch to this
conditional statement.
2:13
I'll do that using an else if clause.
2:16
To check to see if
a variable holds a number,
2:29
you can use the is not a number method.
2:31
So I'll first check to see if
the num1 variable is a number.
2:34
Inside these brackets, I'll add the alert
message that appears if the user types
2:37
in text in the prompt dialogue.
2:41
But we also need to
check the second number.
2:44
One way you could do this is adding
another else if clause to test
2:47
the second number.
2:50
But that would be extra programming
that's just not necessary.
2:51
Another way to do it is
add two pipe characters,
2:54
followed by a second condition.
2:57
The pipe characters
indicate that either one or
3:00
the other of the test have to be true.
3:03
In other words,
if either number one is not a number or
3:05
number two is not a number,
we should alert the user.
3:09
At this point, we have conditional
statements with three branches.
3:12
The first two test for errors and
the last writes a message.
3:16
Let's check it out.
3:19
I'll leave the first input blank and
then type hello in the second, excellent.
3:25
And when I reload it and
use numbers, it works.
3:32
I hope you're able to complete
this practice successfully.
3:36
If not, why not start over and
3:39
try to write the program
without looking at my version.
3:40
Have fun with JavaScript,
and see you again soon.
3:43
You need to sign up for Treehouse in order to download course files.
Sign up