Multiple Branches
An else-if ladder lets you test multiple conditions in order.
The first matching condition runs, and the rest are skipped.
JavaScript Tutorial
JavaScript else if Ladder
An else-if ladder allows you to check multiple conditions in sequence.
The first true condition runs, and the rest are skipped.
Why We Need It
Many real-world rules have tiers or ranges. else-if ladders are perfect for those cases.
Ordering conditions correctly prevents bugs and unexpected behavior.
Syntax
if (a) { ... } else if (b) { ... } else { ... }Basic Example
1. Grade Ranges
const score = 78;
let grade;
if (score >= 90) {
grade = "A";
} else if (score >= 80) {
grade = "B";
} else if (score >= 70) {
grade = "C";
} else {
...Use ordered ranges so the first match wins.
Real World Example
2. Shipping Tiers
const total = 125;
let fee;
if (total > 200) {
fee = 0;
} else if (total > 100) {
fee = 5;
} else {
fee = 10;
}
...Tiers are a common use case for else-if ladders.
Multiple Use Cases
Ordering Matters
Put the most specific or highest-priority conditions first.
A broad condition early can block the rest of the ladder.
When to Use Switch
If you are comparing a single value to many discrete cases, a switch can be clearer.
For ranges or complex conditions, an else-if ladder is usually better.
More Examples
3. Status Mapping
const status = "processing";
let label;
if (status === "paid") {
label = "Paid";
} else if (status === "failed") {
label = "Failed";
} else if (status === "processing") {
label = "Processing";
} else {
...Order the conditions by priority or specificity.
4. Multiple Checks
const age = 17;
const hasId = true;
let result;
if (age >= 18 && hasId) {
result = "Enter";
} else if (age >= 18) {
result = "Need ID";
} else {
result = "Too young";
...Combine logical operators when needed.
Comparison
Without
let label = "";
if (score >= 90) {
label = "A";
}
if (score >= 80) {
label = "B";
}With
let label;
if (score >= 90) {
label = "A";
} else if (score >= 80) {
label = "B";
}Common Mistakes and Fixes
Wrong order
Put the most specific or highest-priority checks first.
Overlapping conditions
Ensure ranges do not overlap in unintended ways.
Too many branches
Consider switch or data-driven maps for large sets.
No default case
Use a final else to handle unexpected values.
Interview Questions
Why does order matter?
The first matching condition stops evaluation of the rest.
When is else-if better than switch?
When you need ranges or complex conditions.
Do I need a final else?
It helps handle unexpected values safely.
Practice Problem
Practice: Create a shipping tier using else-if for totals above 200, above 100, and below 100.
const total = 145;
// TODO: set fee using an else-if ladder
One Possible Solution
const total = 145;
let fee;
if (total > 200) {
fee = 0;
} else if (total > 100) {
fee = 5;
} else {
fee = 10;
}
console.log(fee);Frequently Asked Questions
Does else-if stop after the first match?
Yes, the first true condition runs and the rest are skipped.
When should I use switch instead?
Use switch for many discrete values of one variable.
Can I have nested else-if ladders?
Yes, but readability can suffer.
Try It Yourself
Adjust the score to see which branch fires.