DEV Community

Abimanyu P
Abimanyu P

Posted on

If Else Statements

If Else Statements in JavaScript

In JavaScript, if, else if, and else statements are used to control the flow of a program based on conditions. They allow us to execute different blocks of code depending on whether a condition is true or false.

The basic if statement checks a condition and executes the code inside it only when the condition is true.

let age = 20;

if (age >= 18) {
    console.log("You are an adult");
}
Enter fullscreen mode Exit fullscreen mode

Here, age >= 18 is the condition. Since the value of age is 20, the condition is true, so the code inside the if block gets executed. If the condition is false, JavaScript simply skips that block.

When we want to execute another block of code when the condition is false, we can use else.

let age = 16;

if (age >= 18) {
    console.log("You can vote");
} else {
    console.log("You cannot vote");
}
Enter fullscreen mode Exit fullscreen mode

If there are multiple conditions to check, we can use else if.

let marks = 75;

if (marks >= 90) {
    console.log("Grade A");
} else if (marks >= 75) {
    console.log("Grade B");
} else if (marks >= 50) {
    console.log("Grade C");
} else {
    console.log("Fail");
}
Enter fullscreen mode Exit fullscreen mode

JavaScript checks these conditions from top to bottom. Once it finds a condition that is true, it executes that block and skips the remaining conditions. In this example, marks >= 90 is false, but marks >= 75 is true, so "Grade B" is printed.

We can also put one if statement inside another if statement. This is called a nested if. A nested if is useful when one condition needs to be checked only after another condition has already been satisfied.

let age = 20;
let hasLicense = true;

if (age >= 18) {
    if (hasLicense) {
        console.log("You can drive");
    }
}
Enter fullscreen mode Exit fullscreen mode

Here, the second if is inside the first if. JavaScript first checks whether age >= 18. Only if that condition is true will it check hasLicense. If the person is under 18, the inner condition is not checked.

We can also use else with a nested if.

let age = 20;
let hasLicense = false;

if (age >= 18) {
    if (hasLicense) {
        console.log("You can drive");
    } else {
        console.log("You need a driving license");
    }
} else {
    console.log("You are too young to drive");
}
Enter fullscreen mode Exit fullscreen mode

In this example, the first condition checks the person's age. If the person is at least 18, another condition checks whether they have a license. This creates a decision inside another decision.

Sometimes nested if statements can be replaced with logical operators. For example:

let userLoggedIn = true;
let isAdmin = true;

if (userLoggedIn) {
    if (isAdmin) {
        console.log("Show admin panel");
    }
}
Enter fullscreen mode Exit fullscreen mode

The same logic can be written using the && operator:

if (userLoggedIn && isAdmin) {
    console.log("Show admin panel");
}
Enter fullscreen mode Exit fullscreen mode

Both approaches can work, but nested if statements are useful when the second decision depends on the result of the first condition or when each level needs its own logic.

JavaScript also allows conditions to work with values that are not explicitly true or false. JavaScript evaluates values as truthy or falsy when they are used as conditions.

let username = "Abimanyu";

if (username) {
    console.log("Username exists");
}
Enter fullscreen mode Exit fullscreen mode

A non-empty string is truthy, so the if block executes. On the other hand, an empty string is falsy.

let username = "";

if (username) {
    console.log("Username exists");
} else {
    console.log("Username is empty");
}
Enter fullscreen mode Exit fullscreen mode

So, if, else if, and else are mainly used when we need to make decisions in our JavaScript code. A nested if takes this one step further by allowing one condition to be checked inside another condition. These statements are fundamental for controlling how a program behaves based on different situations.

Top comments (0)