How to Use “if… else” in JavaScript (with Examples)

JavaScript has quickly become one of the most popular programming languages due to its ease of use and flexibility – it can be run in just about any web browser on any device making it perfect for cross-platform apps.

Linux is the most popular platform for hosting JavaScript Apps built with Node.js and is a great platform for developing both standalone JavaScript programs and browser-based solutions.

If you’re learning JavaScript the if… else control structure is one of the first things you’ll want to get the hang of.

With the if… else statement you’ll be able to decide what code to execute based on a value or user input.

How To Use if in JavaScript

The syntax for the JavaScript if command is as follows:

if ( CONDITIONS ) {
    ACTIONS
}

For example:

if (2 < 3) {
    console.log('2 is less than 3');
}

Note that:

• The conditions are surrounded by brackets, and the actions (code to execute if the conditions are true) are surrounded by curly braces
• The actions will only execute if the conditions evaluate as being truthy
• We’re using console.log() which outputs text to the JavaScript console
• All lines end with a ; (This is not mandatory, but is encouraged so that you can easily see where a statement ends)

What is “truthy”?

In JavaScript, a value can be considered “truthy” (evaluates as TRUE in a boolean context) or “falsy” (evaluates as FALSE in a boolean context).

It’s actually easier to define what is “falsy”, rather than list all of the types of values that can be considered “truthy”.

A JavaScript value evaluates as falsy when it is equal to:

• FALSE
• 0
• “” or ”
• null
• undefined
• NaN

And a JavaScript value evaluates as truthy when it’s not falsy!

Alternative Actions With else

If you want your script to do something if your if statement fails, and only if it fails, you can add an else statement:

var val = prompt("Please enter a number");
if (val < 3) {
    console.log(val + ' is less than 3');
} 
else {
    console.log(val + ' is less than 3');
}

Note that:

• We’re using the prompt() method to get user input. This works when running JavaScript in a web browser
• The value of the user input is being stored as the variable val
• Strings in JavaScript are joined with the + operator

Adding Multiple Conditions

If you have multiple conditions you want to check, you can use the && (AND) and || (OR) operators to decide whether actions should be performed:

var val = prompt("Please enter a number");
if (val > 3 && val < 7) {
    console.log(val + ' is greater than 3 and less than 7');
}
else if (val == 3 || val < 0) {
    console.log(val + ' is equal to 3, or is less than 0');
}
else {
    console.log(val + ' is not greater than 3 and less than 7. ' + val + 'is also not equal to 3 or less than 0');
}

Else If

To check multiple sets of conditions and perform different actions if each tests as true, use the else if statement:

var val = prompt("Please enter a number");
if (val > 4) {
    console.log(val + ' is greater than than 4');
}
else if (val > 2) {
    console.log(val + ' is greater than than 2 but less than 4');
}
else {
    console.log(val + ' is less than 2);
}

You can add as many else if statements as you like.

Nested If Statements

You can also place if statements inside other if statements:

var val = prompt("Please enter a number");
if (val > 3) {
    console.log(val + ' is greater than 3');
    if (val > 6) {
        console.log(val + ' is greater than 3 and greater than 6');
    }
}

Comparison Operators

When comparing values in JavaScript, you can use the following operators. Some compare the value, and some will also compare the type of variable.

Comparison Syntax

Comparing equality of values of different types

"7" == 7

This will return TRUE as it is only comparing the value, despite the first value being a string (as it’s wrapped in double-quotes) and the second being a number value.

"7" === 7

This will evaluate as FALSE, as although the values are the same, the first value is stored as a string type variable and the second is a number.

Conclusion

JavaScript if statements are one of the first things you’ll learn and the most common parts of any JavaScript application.

If you’re getting started learning JavaScript on Linux, check out our other articles.