If / Else

So far, every program we wrote ran top to bottom — every single line, every time, no exceptions. That's not how real programs work.

Real programs make decisions. Show this if the user is logged in. Run this if the score is above 50. Skip this if the cart is empty. The ability to run different code based on different conditions is called control flow.

Control flow is how you control which lines run and which don't.

JavaScript gives you several tools for this — if/else, switch, ternary, and short-circuit operators. The most fundamental one is if/else.

The if Statement

An if statement runs a block of code only if a condition is true.

if (condition) {
  // runs only when condition is true
}

let temperature = 38;

if (temperature > 37.5) {
  console.log("You have a fever.");
}
// You have a fever.

The condition is always evaluated as a boolean. If it's truthy — the block runs. If it's falsy — the block is skipped completely.

if / else

Add an else block to handle the case when the condition is false.

if (condition) {
  // runs when true
} else {
  // runs when false
}

let isLoggedIn = false;

if (isLoggedIn) {
  console.log("Welcome back!");
} else {
  console.log("Please log in.");
}
// Please log in.

One of the two blocks always runs — never both, never neither.

else if — Multiple Conditions

When you have more than two possible cases, chain else if blocks.

let score = 72;

if (score >= 90) {
  console.log("Grade: A");
} else if (score >= 80) {
  console.log("Grade: B");
} else if (score >= 70) {
  console.log("Grade: C");
} else if (score >= 60) {
  console.log("Grade: D");
} else {
  console.log("Grade: F");
}
// Grade: C

JavaScript checks each condition from top to bottom. The moment one is true, it runs that block and skips the rest entirely — even if later conditions would also be true.

let age = 25;

if (age >= 18) {
  console.log("Adult");         // this runs
} else if (age >= 21) {
  console.log("Over 21");       // never checked — already matched above
}

Order matters. Always put the most specific conditions first.

Nested if Statements

You can put an if inside another if to check multiple things together.

let isLoggedIn = true;
let hasMembership = false;

if (isLoggedIn) {
  if (hasMembership) {
    console.log("Access granted.");
  } else {
    console.log("You need a membership to continue.");
  }
} else {
  console.log("Please log in first.");
}
// You need a membership to continue.

This works — but if nesting gets too deep, it becomes hard to read. In those cases, combining conditions with && and || is cleaner.

if (isLoggedIn && hasMembership) {
  console.log("Access granted.");
}

Conditions Don't Have to Be Comparisons

Any truthy or falsy value works as a condition — not just === comparisons.

let username = "";

if (username) {
  console.log("Hello, " + username);
} else {
  console.log("No username provided."); // "" is falsy
}

let cart = [];

if (cart.length) {
  console.log("Proceeding to checkout.");
} else {
  console.log("Your cart is empty."); // 0 is falsy
}

let user = null;

if (user) {
  console.log(user.name);
} else {
  console.log("No user found."); // null is falsy
}

This pattern — checking if something exists before using it — is everywhere in real JavaScript code.

A Real Example

let hour = new Date().getHours(); // current hour, 0–23

if (hour < 12) {
  console.log("Good morning!");
} else if (hour < 17) {
  console.log("Good afternoon!");
} else if (hour < 21) {
  console.log("Good evening!");
} else {
  console.log("Good night!");
}

new Date().getHours() returns the current hour as a number. The if/else if chain picks the right greeting based on the time of day. Clean, readable, real.

Summary

• Control flow is controlling which lines of code run based on conditions
• if runs a block only when a condition is truthy
• else handles the falsy case
• else if lets you handle multiple conditions in sequence
• JavaScript checks conditions top to bottom and stops at the first match
• Any truthy or falsy value works as a condition — not just boolean comparisons
• Avoid deep nesting — combine conditions with && and || instead