JavaScript If-Else Statement

The if-else statement in JavaScript is used to run code based on a condition. If the condition is true, a block of code runs. Otherwise, another block can be executed using else.

This structure is fundamental in controlling the flow of your program and making decisions based on variables or user inputs.

What You'll Learn

In this section, you’ll learn how to use JavaScript’s if, else, and else if to create decision-based logic in your programs.

Understanding the if-else Statement

The basic syntax for the if-else statement is:

javascript
if (condition) {
    // Block of code if condition is true
} else {
    // Block of code if condition is false
}
  • condition: An expression that returns true or false.
  • if: Executes the block if the condition is true.
  • else: Executes the block if the condition is false.

Example 1: Basic If Statement

This example checks if a number is positive. If it is, it prints a message.

javascript
let number = 1;
if (number > 0) {
    console.log("The number is positive.");
}

How It Works:

  • number = 1: We set the value of the number to 1.
  • if (number > 0): This checks if the number is greater than 0.
  • If true, it prints "The number is positive." to the console.

Output

The number is positive.
Example-1 Flowchart Image
Flowchart showing the decision process for checking if a number is positive.

Example 2: Using If-Else to Check Even or Odd

This example checks if a number is even or odd using the modulo operator %.

javascript
let number = 2;

if (number % 2 === 0) {
    console.log("The number is even.");
} else {
    console.log("The number is odd.");
}

How It Works:

  • number = 2: We set the value of the number to 2.
  • number % 2 === 0: This checks if the remainder when divided by 2 is 0.
  • If true, it prints "The number is even." to the console.
  • Otherwise, it prints "The number is odd.".

Output

The number is even.
Example-2 Flowchart Image
Flowchart illustrating how the program determines if a number is even or odd.

Example 3: Checking for Equality

This example compares two variables to determine if they are equal using the strict equality operator ===.

javascript
let x = 5;
let y = 5;

if (x === y) {
    console.log("x and y are equal.");
} else {
    console.log("x and y are not equal.");
}

How It Works:

  • x = 5 and y = 5: We assign the values 5 to both variables.
  • x === y: This checks if both variables have the same value and type.
  • If true, it prints "x and y are equal." to the console.
  • If not, it prints "x and y are not equal.".

Output

x and y are equal.
Example-3 Flowchart Image
Flowchart showing the equality comparison between two variables.

Example 4: Using Else If to Check Positive, Negative, or Zero

This example checks whether a number is positive, negative, or zero using an if, else if, and else structure.

javascript
let number = 0;

if (number > 0) {
    console.log("The number is positive.");
} else if (number < 0) {
    console.log("The number is negative.");
} else {
    console.log("The number is zero.");
}

How It Works:

  • number = 0: We set the value of the number to 0.
  • if (number > 0): This checks if the number is greater than 0.
  • else if (number < 0): If not, this checks if it’s less than 0.
  • else: If both conditions are false, it must be 0, so it prints "The number is zero.".

Output

The number is zero.
Example-4 Flowchart Image
Flowchart depicting how a number is evaluated as positive, negative, or zero.

Example 5: Nested If-Else

This example uses a nested if statement to check whether a number is positive and then determine if it's even or odd.

javascript
let number = 4;

if (number > 0) {
    if (number % 2 === 0) {
        console.log("The number is positive and even.");
    } else {
        console.log("The number is positive and odd.");
    }
} else if (number < 0) {
    console.log("The number is negative.");
} else {
    console.log("The number is zero.");
}

How It Works:

  • number = 4: We assign the number 4 to the variable.
  • if (number > 0): Checks if the number is greater than 0.
  • Since the condition is true, the nested if block runs.
  • number % 2 === 0: Checks if the number is even.
  • Since 4 is even, it prints "The number is positive and even.".

Output

The number is positive and even.
Example-5 Flowchart Image
Flowchart showing nested if-else logic to determine positivity and parity of a number.

Exercises

Try out the following exercises to practice using the if-else statement in JavaScript:

1. Check if a number is even or odd.
javascript
let number = 7;
if (number % 2 === 0) {
    console.log("The number is even.");
} else {
    console.log("The number is odd.");
}
2. Check voting eligibility (age >= 18).
javascript
let age = 20;
if (age >= 18) {
    console.log("Eligible to vote.");
} else {
    console.log("Not eligible to vote.");
}
3. Print "Hello, World!" if a variable is true, otherwise print "Goodbye!".
javascript
let isTrue = true;
if (isTrue) {
    console.log("Hello, World!");
} else {
    console.log("Goodbye!");
}

*Tip: Change variable values to test different outcomes!

Frequently Asked Questions

What is an if-else statement in JavaScript?

An if-else statement in JavaScript allows you to execute different blocks of code depending on whether a condition evaluates to true or false.

What is the difference between if, else if, and else?

The if block runs when its condition is true. The else if block checks another condition if the first is false. The else block runs when none of the previous conditions are met.

Can you nest if-else statements in JavaScript?

Yes, JavaScript allows you to nest if and else blocks inside each other to create more detailed decision logic.

When should I use if-else instead of switch?

Use if-else when comparing ranges, booleans, or expressions. Use switch when comparing one value against many constant options.

Can I use multiple else if blocks in JavaScript?

Yes, JavaScript allows you to chain multiple else if conditions to handle several different cases.

What's Next?

In the upcoming section, we'll explore the while loop — a fundamental control structure that allows code to execute repeatedly based on a given condition. Understanding how while loops work is essential for writing efficient and dynamic programs.