fervor [>]CODING & CURIOSITY
FERVOR LEARNING SYSTEMTUTORIALS
← JavaScript

JavaScript / 5 MIN READ

else if

Handle multiple conditions with else-if statements

From the original Fervor library. Examples may use older package versions.

else if Statement

The else if statement in JavaScript allows you to have multiple conditions within a single if...else statement. This lets you run different blocks of code based on different conditions.

Here’s the general structure of an if...else if...else statement:

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

Let’s see an example:

let weather = "rainy";

if (weather === "sunny") {
  console.log("Let's go to the beach!");
} else if (weather === "rainy") {
  console.log("Let's stay indoors and read a book.");
} else {
  console.log("Let's go for a walk.");
}

In this case:

  1. If weather is “sunny”, “Let’s go to the beach!” will be logged to the console.
  2. If weather is not “sunny” but is “rainy”, “Let’s stay indoors and read a book.” will be logged to the console.
  3. If weather is neither “sunny” nor “rainy”, “Let’s go for a walk.” will be logged.

You can have as many else if conditions as you want, and the conditions will be checked in order. As soon as a condition is found to be true, its corresponding block of code is executed, and the rest of the conditions are skipped.

The else clause at the end is optional and represents a default action to be taken when none of the conditions are met. If the else clause is omitted and none of the conditions are true, then no action is taken.

Bonus Cool Else if stuff

Certainly! The else if statement in JavaScript allows you to have multiple conditions within a single if...else statement. This lets you run different blocks of code based on different conditions.

Here’s the general structure of an if...else if...else statement:

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

Let’s see an example:

let weather = "rainy";

if (weather === "sunny") {
  console.log("Let's go to the beach!");
} else if (weather === "rainy") {
  console.log("Let's stay indoors and read a book.");
} else {
  console.log("Let's go for a walk.");
}

In this case:

  1. If weather is “sunny”, “Let’s go to the beach!” will be logged to the console.
  2. If weather is not “sunny” but is “rainy”, “Let’s stay indoors and read a book.” will be logged to the console.
  3. If weather is neither “sunny” nor “rainy”, “Let’s go for a walk.” will be logged.

You can have as many else if conditions as you want, and the conditions will be checked in order. As soon as a condition is found to be true, its corresponding block of code is executed, and the rest of the conditions are skipped.

The else clause at the end is optional and represents a default action to be taken when none of the conditions are met. If the else clause is omitted and none of the conditions are true, then no action is taken.

Bonus tips

Sure, here are some tips and tricks to keep in mind when working with else if:

  1. Order Matters: In an else if chain, JavaScript executes the first condition that evaluates to true and then exits the chain. It won’t check the remaining conditions. Therefore, always place more specific conditions at the top of the chain and more general ones at the bottom. This way, you won’t accidentally bypass a specific condition by meeting a more general one first.

  2. Use Switch for Multiple Conditions on a Single Variable: If you’re checking the same variable for equality against many different values, a switch statement can be cleaner and easier to read than an else if chain. It’s important to remember to include break after each case to prevent unintentional “fallthrough” to the next case.

  3. Use Ternary Operators for Simple Conditions: If your else if chain only has two outcomes and the conditions are simple, consider using a ternary operator (condition ? expressionIfTrue : expressionIfFalse). This can make your code more concise.

  4. Avoid Unnecessary Else If Statements: If you’re returning a value in the if or else if blocks, you don’t need to use an else if or else statement because the function will exit as soon as it hits a return statement. For example:

function isAdult(age) {
  if (age >= 18) {
    return true;
  }
  return false;
}

In this case, the function returns true if age is greater than or equal to 18. If it’s not, the function skips to the next line after the if block and returns false. An else is not necessary here.

  1. Always Have a Default Condition: If there’s a chance that none of the if or else if conditions will be met, it’s good practice to include an else statement at the end of the chain to handle the default case.

  2. Consider Performance: In an else if chain, each condition is checked in order until one evaluates to true. If a certain condition is more likely to be true than the others, consider placing it at the top of the chain. This way, the code can skip checking the rest of the conditions most of the time, which could lead to performance benefits in some scenarios.

Keep your curiosity going.Explore more JavaScript →
287 TUTORIALS · 22 TOPICSREADY