Skip to main content

Command Palette

Search for a command to run...

Control flow: if, else, and switch explained

Updated
5 min readView as Markdown
Control flow: if, else, and switch explained

Every program needs to make decisions. Control flow is how your code chooses which path to take — just like real-life choices, but written in JavaScript.

What is control flow?

Your code makes decisions

Normally, JavaScript runs your code line by line, top to bottom. But most programs need to react to different situations — show a welcome message if the user is logged in, show an error if they're not. That ability to branch is called control flow.

Think about decisions you make every day:

Real life

ifit's raining → carry an umbrella

ifscore ≥ 90 → grade A

ifage ≥ 18 → you can vote

ifday = Monday → start of week

In JavaScript

if (rain)bringUmbrella()

if (score >= 90)grade = "A"

if (age >= 18)canVote = true

switch (day)case "Mon"...

JavaScript gives you two main tools for this: if / else for flexible conditions, and switch for checking one value against many possibilities.

if statement

The simplest decision

An if statement runs a block of code only if a condition is true. If the condition is false, it skips the block entirely.

Basic if statement

const age = 20;

if (age >= 18) {
  console.log("You are an adult.");
}

// age is 20 — condition is true, so this prints
// Output: You are an adult.

How JavaScript reads this, step by step

const age = 20 ----- age is now 20

if (age >= 18) → if (20 >= 18) → if (true) -------- condition: true

console.log("You are an adult.") ------- runs

Condition must be in parentheses — the ( ) after if are required. The code block goes inside { }. If you forget the curly braces on a single-line if, only the very next line is affected — a common source of bugs.

if-else statement

Two paths: do this, or do that

Sometimes you want your program to do something different when the condition is false. That's what else is for — it's the fallback path.

if-else — two possible outcomes

const marks = 45;

if (marks >= 50) {
  console.log("You passed!");
} else {
  console.log("You need to study more.");
}

// marks = 45 — condition is false
// Output: You need to study more.

Flowchart — how if-else branches

else if ladder

Multiple conditions in sequence

When you have more than two possibilities, you chain conditions together with else if. JavaScript checks each one in order and runs the first block that's true — then skips the rest.

Grading system — else if ladder

const marks = 72;

if (marks >= 90) {
  console.log("Grade: A");
} else if (marks >= 75) {
  console.log("Grade: B");
} else if (marks >= 60) {
  console.log("Grade: C");
} else {
  console.log("Grade: F — try again");
}

// marks = 72 → skips A, skips B, passes C
// Output: Grade: C

How JavaScript walks the ladder with marks = 72

if (72 >= 90) → false ----------- skip — move on

else if (72 >= 75) → false ------------------- skip — move on

else if (72 >= 60) → true ----------------------- match! run this

console.log("Grade: C") runs --------------------- rest is skipped

Key rule: Once one condition matches, JavaScript stops checking. The else at the bottom is a safety net — it only runs if nothing above matched.

switch statement

One value, many cases

When you need to compare the same variable to many specific values, switch is cleaner than a long chain of else if. It takes one value and jumps straight to the matching case.

Day of the week using switch

const day = 3;

switch (day) {
  case 1:
    console.log("Monday");
    break;
  case 2:
    console.log("Tuesday");
    break;
  case 3:
    console.log("Wednesday");
    break;
  case 4:
    console.log("Thursday");
    break;
  case 5:
    console.log("Friday");
    break;
  default:
    console.log("Weekend!");
}

// day = 3 → jumps to case 3
// Output: Wednesday

Switch branching — each case is a direct exit

What does break do? Without break, JavaScript keeps running into the next case even if it already found a match. This is called fall-through and almost always causes bugs. Always put break at the end of each case — unless you deliberately want fall-through.

switch vs if-else

When to use which?

Both do similar things. Here's a simple rule of thumb:

Situation Use Why
Checking a range (> 50, < 100) if / else if Ranges aren't exact values
Checking one variable against many exact values switch Cleaner, easier to read
Complex or combined conditions if / else if switch can't do && or `
Days, months, menu options switch Perfect fit for named categories
Two outcomes only if / else Simplest tool for the job

Practical tip: When you find yourself writing five or more else if blocks all checking the same variable, that's a signal to switch to switch.