Conditionals
Conditional statements control behavior in JavaScript and determine whether or not pieces of code can run.
There are multiple different types of conditionals in JavaScript including:
- “If” statements: where if a condition is true it is used to specify execution for a block of code.
- “Else” statements: where if the same condition is false it specifies the execution for a block of code.
- “Else if” statements: this specifies a new test if the first condition is false.
Now that you have the basic JavaScript conditional statement definitions, let’s show you examples of each.
// Learn How to Become a Web Developer with Pluralsight Skills
If Statement Example
As the most common type of conditional, the if statement only runs if the condition enclosed in parentheses () is truthy.
EXAMPLE |
---|
if (10 > 5) { var outcome = "if block"; } outcome; |
OUTPUT |
"if block" |
Here’s what’s happening in the example above:
- The keyword if tells JavaScript to start the conditional statement.
- (10 > 5) is the condition to test, which in this case is true — 10 is greater than 5.
- The part contained inside curly braces {} is the block of code to run.
- Because the condition passes, the variable outcome is assigned the value "if block".
Else Statement Example
You can extend an if statement with an else statement, which adds another block to run when the if conditional doesn’t pass.
EXAMPLE |
---|
if ("cat" === "dog") { var outcome = "if block"; } else { var outcome = "else block"; } outcome; |
OUTPUT |
"else block" |
In the example above, "cat" and "dog" are not equal, so the else block runs and the variable outcome gets the value "else block".
Else If Statement Example
You can also extend an if statement with an else if statement, which adds another conditional with its own block.
EXAMPLE |
---|
if (false) { var outcome = "if block"; } else if (true) { var outcome = "else if block"; } else { var outcome = "else block"; } outcome; |
OUTPUT |
"else if block" |
You can use multiple if else conditionals, but note that only the first else if block runs. JavaScript skips any remaining conditionals after it runs the first one that passes.
EXAMPLE |
---|
if (false) { var outcome = "if block"; } else if (true) { var outcome = "first else if block"; } else if (true) { var outcome = "second else if block"; } else { var outcome = "else block"; } outcome; |
OUTPUT |
"first else if block" |
An else if statement doesn’t need a following else statement to work. If none of the if or else if conditions pass, then JavaScript moves forward and doesn’t run any of the conditional blocks of code.
EXAMPLE |
---|
if (false) { var outcome = "if block"; } else if (false) { var outcome = "else if block"; } outcome; |
OUTPUT |
"first else if block" |
Ready to learn more?
Become a Javascript developer at your own pace!
When you sign up with Pluralsight, you'll immediately have access to thousands of expert courses, paths to guide your learning, tools to measure your skills and hands-on resources like exercise files. Javascript is just the beginning. There’s no limit on what you can learn and you can cancel at any time.