JavaScript Conditionals

In JavaScript, conditional statements act as decision-makers. They run codes based on a specific condition. If the condition for executing the code is not met, the code will not be executed.

There are several conditional statements in JavaScript which includes:

if statement
if..else statement
if..else...if statement

We'll learn about these three conditional statements and how to utilize them in our code in this tutorial.

if statement
if statement syntax
if..else statement
if..else statement syntax
if..else...if statement
if..else...if statement syntax
Conclusion
Reference

if statement

The if statement is quite easy, it simply allows JavaScript to execute a block of code only if the condition is true.

if statement syntax

if ("this particular expression is true") {
      // execute this statement
   }

Allow me to break it down for you. The expression will be evaluated in this syntax, and if the result is found to be true, the statement will be executed; however, if the expression is not true, the statement will not be executed.

Here's an example of how to use the if statement:

age = 22;
if (age > 19) {
     console.log ("This is a young adult");
}

Output

This is a young adult

The output returned in this example is valid because the expression (age) was evaluated and found to be true.

if..else statement

The if..else statement is also quite easy. It allows JavaScript to execute a block of code if the condition is false.

if..else statement syntax

if ("this particular expression is true") {
      // execute this statement if the expression is true
   } else {
      // execute this statement if the expression is not true
  }

An example of how to utilize the if..else sentence is as follows:

let age = 16;
if (age > 18) {
    console.log ("This is a young adult");
} else {
    console.log ("This is a teenager!");
}

Output

This is a teenager!

In this example, I defined a condition that must be met; if it is true, the first statement will be run; if it is false, the second statement will be executed, and the output shows that the condition is false.

if..else...if statement

The if..else...if statement allows JavaScript to execute a block of code based on several conditions

if..else...if statement syntax

if ("expression A") {
      // execute this statement if the expression A is true
    } else if ("expression B") {
      // execute this statement if the expression B is true
    } else if ("expression C") {
      // execute this statement if the expression C is true
    } else {
      (execute this statement if none of the expression is true) 
 }

This syntax might look complex to you but it's actually very simple, let's break it down in this example:

let color = "red";
if ( color == "yellow" ) {
       console.log ("This is yellow!");
    } else if ( color == "indigo" ) {
        console.log ("This is indigo!");
    } else if ( color == "red" ) {
        console.log ("This is red!");
    } else { 
        console.log ("color not specified");
 }

Output

This is red!

The result is red in this case because it is the sole true block of code among the numerous conditions.

Conclusion

This article has covered how JavaScript conditionals act as decision makers and how the likelihood of a block of code being executed is determined by one or more conditions.

We also looked at three JavaScript conditional statements: the if statement (which allows JavaScript to execute a block of code only if the condition is true), the if..else statement (which allows JavaScript to execute a block of code if the condition is false), and the if..else...if statement (can only execute a block of code based on several conditions)

JavaScript Conditionals