if-else in JavaScript

Analogy categoryAnalogies

1. Introduction

The if-else statement is the most fundamental decision-making tool in JavaScript. It lets a program execute one block of code when a condition is true, and a different block when it is false. Almost every non-trivial program needs to branch based on data — validating user input, checking permissions, or choosing between two calculations — and if-else is the building block for all of that logic.

🏏

Cricket analogy: An umpire deciding out or not out based on a DRS review is exactly an if-else branch — if the ball-tracking shows impact within the stumps, give it out; else, not out — the fundamental decision tool underlying every close call.

JavaScript evaluates the condition inside the parentheses as a boolean. If the condition is truthy, the if block runs; otherwise, control moves to an else if block (if present) or the final else block. You can chain as many else if clauses as needed to handle multiple distinct cases.

🏏

Cricket analogy: A match referee checks conditions in order — if rain persists, abandon; else if the ground is unfit, delay; else, play resumes — chaining multiple else-if branches just like an umpire's decision tree for weather.

2. Syntax

javascript

if (condition1) {
  // runs when condition1 is truthy
} else if (condition2) {
  // runs when condition1 is falsy and condition2 is truthy
} else {
  // runs when all conditions above are falsy
}

// Single-statement bodies can omit braces (not recommended for readability)
if (isReady) console.log('Go!');

// Ternary operator as a compact alternative for simple if-else
const label = age >= 18 ? 'adult' : 'minor';

3. Explanation

The condition in an if statement does not have to be a literal boolean — JavaScript coerces it to true or false using its internal ToBoolean rules. Any value that is not one of the falsy values is treated as truthy.

🏏

Cricket analogy: A selector treats any player who isn't officially injured, suspended, or out of form as available by default — everyone else, even with a shaky recent record, still counts as selectable, mirroring how JavaScript treats any value that isn't one of the specific falsy values as truthy.

else if is simply syntactic convenience: it is really an else block whose body is another if statement. Only the first matching branch executes; once a condition is true, JavaScript skips all the remaining else if / else branches in that chain, even if a later condition would also be true.

🏏

Cricket analogy: Once the third umpire confirms a catch is clean on review, the appeal process stops right there — nobody checks whether the batter was also short of his crease, just as JavaScript stops evaluating else-if branches the instant one condition matches.

There are exactly six falsy values in JavaScript: false, 0 (and -0), '' (empty string), null, undefined, and NaN. Every other value — including '0', 'false', [], and {} — is truthy. A very common bug is checking if (someArray.length) and forgetting that an empty array is truthy even though its length (0) is falsy; always compare the value you actually intend to test, e.g. if (someArray.length > 0).

4. Example

javascript

function classify(score) {
  if (score >= 90) {
    return 'A';
  } else if (score >= 80) {
    return 'B';
  } else if (score >= 70) {
    return 'C';
  } else {
    return 'F';
  }
}

console.log(classify(95));
console.log(classify(82));
console.log(classify(55));

const input = '';
if (input) {
  console.log('input has content');
} else {
  console.log('input is empty or falsy');
}

5. Output

text

A
B
F
input is empty or falsy

6. Key Takeaways

if-else lets a program choose between alternative code paths based on a condition.
Conditions are coerced to boolean using truthy/falsy rules, not just literal true/false.
Only false, 0, '', null, undefined, and NaN are falsy — everything else is truthy.
else if chains stop at the first true condition; later branches are skipped even if also true.
The ternary operator (condition ? a : b) is a concise alternative for simple two-way branches.
Always use braces {} for if/else bodies to avoid bugs when adding more statements later.