- Introducing Conditional Statements 8:39
- Comparison Operators 7:19
- Conditional Statements and Operators Review 7 questions
- Use Comparison Operators 1 objective
- Boolean Values 7:32
- Program Multiple Outcomes 5:45
- Booleans and Else If Review 5 questions
- Write an 'if' Statement 1 objective
- Add an 'else if' Clause 1 objective
- Add a Final 'else' Clause 1 objective
- Test Multiple Conditions With the && Operator 3:57
- Test Multiple Conditions With the || Operator 4:04
- Document Your Code with Comments 4:43
- Multiple Conditions and JavaScript Comments Review 6 questions
- The Conditional Challenge 2:17
- The Conditional Challenge Solution 6:23
- Use Multiple Conditions 1 objective
Preview
Video Player
00:00
00:00
The Conditional Challenge
2:17You've learned enough to put together complete programs! Now you're going to write a simple quiz application utilizing most of your new-found JavaScript knowledge.
You've learned a lot about JavaScript so
far, variables, strings, numbers, and
0:00
conditional statements.
0:04
In fact, you learned enough to
put together complete programs.
0:05
So let's wrap this course up with a little
simulation that will produce a working
0:09
program that utilizes most of your
newfound JavaScript knowledge.
0:12
For this exercise, I want you to
write a simple quiz application.
0:17
Let's have a look at
what you'll need to do.
0:21
Launch the new workspace with this
video to access the starter files for
0:24
this challenge.
0:27
Open the quiz.js file
located inside the js folder,
0:28
this is where you'll write all your code.
0:32
And the file is already
linked to index.html.
0:34
I've provided the instructions for
this challenge as JavaScript comments.
0:38
So let's go over the tasks your
application needs to perform.
0:41
The quiz app should ask
at least five questions,
0:45
you'll store the answer to
each question in a variable.
0:48
It also needs to keep track of the number
of questions the user answered correctly
0:52
using a variable.
0:56
And here's a hint, the addition assignment
operator can help you with this.
0:57
For example,
if a user provides the correct answer,
1:01
use reassignment to assign
the current number of correct answers
1:05
plus one to the variable you
declare here in step one.
1:09
Then it needs to rank the player.
1:15
If the player answered all five questions
correctly, give that player a gold crown.
1:18
Three to four is a silver crown, one to
two correct answers is a bronze crown,
1:24
and zero correct is no crown at all.
1:29
Keep track of the ranking with
the variable you declare here in step two.
1:32
Finally, the app should show a final
message on the page after the quiz,
1:38
letting the user know the number of
questions they got right and the ranking.
1:42
You can display the ranking below or
1:47
next to the number of correct answers,
for instance.
1:49
Notice how you're asked to select
the main element in index.html.
1:52
This is where you'll
display the final message.
1:57
The goal is to get your quiz
app to work similar to this.
2:05
In the next video, I'll show you
how I would program this challenge.
2:10
Good luck and have fun.
2:14