The else if statement in JavaScript provides a way to test multiple conditions in sequence. It executes a block of code if a specified condition is true, but only if the preceding if and any previous else if conditions were false. This allows for more complex conditional logic than a simple if...else statement.

Example 1: Checking Number Ranges

let num = 75;

if (num < 50) {
  console.log("Number is less than 50.");
} else if (num >= 50 && num <= 100) {
  // This block will execute because num is 75.
  console.log("Number is between 50 and 100.");
} else {
  console.log("Number is greater than 100.");
}

Explanation

This code checks if num falls into one of three ranges. The else if condition is evaluated because the initial if condition (num < 50) is false. The else if condition (num >= 50 && num <= 100) is true, so its corresponding message is printed.

Example 2: Grading System

let score = 85;
let grade;

if (score >= 90) {
  grade = 'A';
} else if (score >= 80) {
  // This block executes as score is 85.
  grade = 'B';
} else if (score >= 70) {
  grade = 'C';
} else {
  grade = 'D';
}

console.log(`Your grade is: ${grade}`);

Explanation

This example determines a letter grade based on a numeric score. The else if statements create a chain of checks. Since score is 85, the first if fails, but the first else if (score >= 80) passes, assigning 'B' to grade.

Example 3: Day of the Week

let dayNumber = 3;
let dayName;

if (dayNumber === 1) {
  dayName = "Sunday";
} else if (dayNumber === 2) {
  dayName = "Monday";
} else if (dayNumber === 3) {
  // This block is chosen.
  dayName = "Tuesday";
} else {
  dayName = "Invalid day";
}

console.log(dayName);

Explanation

This code maps a number to a day of the week. The else if ladder is perfect for checking multiple specific values. The condition dayNumber === 3 is met, so dayName becomes "Tuesday".

Example 4: User Role Authorization

let userRole = "editor";
let canAccess = false;

if (userRole === "admin") {
  canAccess = true;
} else if (userRole === "editor") {
  // This condition is met.
  canAccess = true;
} else {
  canAccess = false;
}

console.log(`Access granted: ${canAccess}`);

Explanation

This demonstrates using else if for authorization. The code checks the userRole. Since the role is "editor", the else if block is executed, setting canAccess to true.

Example 5: Temperature Feedback

let temperature = 15; // in Celsius

if (temperature > 30) {
  console.log("It's hot outside.");
} else if (temperature > 20) {
  console.log("It's a pleasant day.");
} else if (temperature > 10) {
    // This code block runs.
  console.log("It's a bit cool.");
} else {
  console.log("It's cold.");
}

Explanation

Here, else if provides feedback based on temperature. The first two conditions fail. The third condition, temperature > 10, is true for a value of 15, so "It's a bit cool." is logged to the console.

Example 6: Handling Multiple String Values

let fruit = "apple";

if (fruit === "banana") {
  console.log("This is a banana.");
} else if (fruit === "apple") {
  // This code will be executed.
  console.log("This is an apple.");
} else if (fruit === "orange") {
  console.log("This is an orange.");
}

Explanation

This code identifies a fruit by its name. The else if statement checks for the string "apple" after the first if condition for "banana" fails. The condition is true, and the corresponding message is displayed.

Example 7: Tiered Discount System

let purchaseAmount = 120;
let discount = 0;

if (purchaseAmount >= 200) {
  discount = 0.20; // 20% discount
} else if (purchaseAmount >= 100) {
    // This condition is true.
  discount = 0.10; // 10% discount
} else if (purchaseAmount >= 50) {
  discount = 0.05; // 5% discount
}

console.log(`Your discount is ${discount * 100}%.`);

Explanation

This code calculates a discount based on the purchase amount. For an amount of 120, the purchaseAmount >= 200 check is false. The else if (purchaseAmount >= 100) check is true, so a 10% discount is applied.