JavaScript if…else statement

Introduction

In JavaScript, this decision-making is handled using conditional statements, and the most commonly used one is the if…else statement.

In JavaScript, if, else, and else if are control flow statements that allow you to execute certain blocks of code based on specific conditions. These statements help you make decisions in your code.

What is an if…else Statement?

The if…else statement is used to execute a block of code based on a condition.

• If the condition is true, the if block runs
• If the condition is false, the else block runs

Basic Example:

let age = 18;

if (age >= 18) {
   console.log("You are an adult");
} else {
   console.log("You are a minor");
}

Syntax of if…else

if (condition) {
   // code to execute if condition is true
} else {
   // code to execute if condition is false
}

Types of if…else Statements

JavaScript provides different variations of if statements:

1. Simple if Statement

The if statement is used to execute a block of code if a specified condition is true.

Syntax:

if (condition) {
    // Code to execute if the condition is true
}

Example:

let age = 20;
if (age >= 18) {
    console.log("Eligible for vote");
}

2. if…else Statement

The else statement is used to execute a block of code if the if condition is false.

Syntax:

if (condition) {
    // Code to execute if the condition is true
} else {
    // Code to execute if the condition is false
}

Example:

let age = 20;
if (age >= 21) {
    console.log("You are an adult.");
} else {
    console.log("You are not an adult.");
}

In this example, the message “You are not an adult.” will be logged to the console because the condition age >= 21 is false.

3. if…else if…else Statement

The else if statement allows you to check additional conditions if the previous if condition is false. You can chain multiple else if statements together.

Syntax:

if (condition1) {
    // Code to execute if condition1 is true
} else if (condition2) {
    // Code to execute if condition1 is false and condition2 is true
} else {
    // Code to execute if both condition1 and condition2 are false
}

Example:

let score = 85;

if (score >= 90) {
    console.log("Grade: A");
} else if (score >= 80) {
    console.log("Grade: B");
} else if (score >= 70) {
    console.log("Grade: C");
} else {
    console.log("Grade: F");
}

In this example, the message Grade: B will be logged to the console because the condition score >=80 is true, and the conditions before it are false.

4. Nested if Statement

An if inside another if.

let age = 20;
let hasID = true;

if (age >= 18) {
   if (hasID) {
       console.log("Allowed");
   }
}

Real-Life Examples

1. Login System

let username = "admin";
let password = "123";

if (username === "admin" && password === "123") {
   console.log("Login Successful");
} else {
   console.log("Invalid Credentials");
}

2. Age Verification

let age = 17;

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

3. Even or Odd

let number = 7;

if (number % 2 === 0) {
   console.log("Even");
} else {
   console.log("Odd");
}

4. Discount System

let price = 1000;

if (price > 500) {
   console.log("Discount applied");
} else {
   console.log("No discount");
}

if vs Ternary Operator

The ternary operator is a shortcut for if…else.

Example:

let age = 18;
let result = (age >= 18) ? "Adult" : "Minor";

Common Mistakes

You will see some common mistakes.

1. Forgetting Curly Braces

if (true)
   console.log("Hello");
   console.log("World"); // runs always

2. Not Handling All Cases

if (age > 18) {
   console.log("Adult");
}
// missing else

3. Incorrect Condition Order

if (marks >= 70) { }
else if (marks >= 90) { } // never reached

 4. Using == Instead of ===

You should use === when you are comparing the values.

if (5 == "5") { } // risky

Correct way:

if (5 === "5") { } // risky

JavaScript if else statement – Interview Questions

JavaScript if else statement – Objective Questions (MCQs)

Conclusion

The JavaScript if…else statement is a fundamental tool for decision-making in programming. It allows your code to behave dynamically based on conditions, making applications interactive and intelligent.

By mastering if, else, and else if, along with best practices, you can write clean, efficient, and bug-free JavaScript code.