Control Flow in JavaScript: If, Else, and Switch Explained

As we are in March 2026, still only the 3rd month of the new year, many of us had a resolution to lose weight this year. So whenever you see your favourite junk food, sweets, ice cream, or chocolate, you start thinking: Should I eat this now and work out later? Or just skip it and stick to my resolution?

Your brain makes a decision and gives you the result based on that. That’s basically control flow in JavaScript. There are multiple possible conditions, and one of them becomes true and decides what happens next.

In this blog, I’ll explain control flow in JavaScript using if, else, and switch.

What does control flow mean in programming

In JavaScript, code normally runs from top to bottom, line by line. But with control flow, you can structure the program so it can skip certain parts of the code based on conditions. It makes decisions and runs only the code that satisfies the condition.

Line 1
Line 2
Line 3
Condition check
    ├─ If true → execute this code
    └─ If false → skip or execute different code

If the condition isn't true, JavaScript just skips that code block and moves on.

The if Statement

The if statement works exactly like English “if.” The only extra things we need are parentheses () for the condition and curly braces {} for the code to run. This is the simplest way to check a condition in JavaScript.

Syntax

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

Real-life example: "If I have money, I'll buy coffee."

Code example:

let money = 100;

if (money > 0) {
  console.log("I'll buy coffee");
}
// Output: I'll buy coffee

What's happening here?

We have ₹100 (let's assume). If the money is greater than 0, then we'll buy coffee. But what if we don't have any money? Then the condition is false, and the whole code inside the curly braces gets skipped - no coffee for us!

The if-else Statement

The else part is an addition to the if statement. It means one condition is always true and the other is false - you get a result either way.

Syntax:

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

Real-life example: "If it's sunny, I'll go to the park. Otherwise, I'll stay home."

Code example:

let isSunny = true;

if (isSunny) {
  console.log("I'll go to the park");
} else {
  console.log("I'll stay home");
}
// Output: I'll go to the park

Another example:

let age = 16;

if (age >= 18) {
  console.log("You can vote");
} else {
  console.log("You cannot vote yet");
}
// Output: You cannot vote yet

The else if Ladder

When you have more than 2 conditions, use else if.

Syntax:

if (condition1) {
  // runs if condition1 is true
} else if (condition2) {
  // runs if condition1 is false AND condition2 is true
} else if (condition3) {
  // runs if condition1 and condition2 are false AND condition3 is true
} else {
  // runs if all conditions are false
}

Real-life example: Grading system

let marks = 82;

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: Fail");
}
// Output: Grade: B

What's happening here?

JavaScript checks the marks step by step:

1. Is marks >= 90? No (82 is less than 90) → Skip

2. Is marks >= 75? Yes (82 >= 75) → Execute this block! Print "Grade: B"

3. Stop checking! Once one condition matches, the rest are skipped

The last else block is the default result if all conditions are false.

Another example: Deciding what to eat based on your budget

let budget = 250;

if (budget >= 500) {
  console.log("Let's go to that fancy restaurant!");
} else if (budget >= 200) {
  console.log("Street food it is - vada pav or pani puri?");
} else if (budget >= 50) {
  console.log("Chai and biscuit from the tapri");
} else {
  console.log("Water is free, my friend");
}
// Output: Street food it is - vada pav or pani puri?

The switch Statement

switch is similar to if-else, but it checks one value against multiple exact matches. Instead of else, we use default for the fallback case. default is optional but recommended.

Syntax:

switch (expression) {
  case value1:
    // code for value1
    break;
  case value2:
    // code for value2
    break;
  case value3:
    // code for value3
    break;
  default:
    // code if no match
}

Real-life example: Day of the week

let 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;
  case 6:
    console.log("Saturday");
    break;
  case 7:
    console.log("Sunday");
    break;
  default:
    console.log("Invalid day");
}
// Output: Wednesday

Why break is IMPORTANT

Without break, JavaScript continues executing the next cases even after finding a match.

let day = 3;

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

/* Output:
Wednesday
Thursday
*/

What is happening here?

We wanted day 3 (Wednesday), but we got both Wednesday AND Thursday! Why? Why? Because we didn't use break after case 3. The code just "fell through" to the next case and kept executing until it hit a break.

This behavior is called fall-through. Sometimes useful, but often a bug.

When Fall-Through is Useful:

let day = "Saturday";

switch (day) {
  case "Saturday":
  case "Sunday":
    console.log("It's the weekend! Time to binge-watch!");
    break;
  case "Monday":
  case "Tuesday":
  case "Wednesday":
  case "Thursday":
  case "Friday":
    console.log("It's a weekday - back to work!");
    break;
}
// Output: It's the weekend! Time to binge-watch!

Here, both Saturday and Sunday are weekends, so there's no break after Saturday. This is intentional; we want the same result for both days.

Another example: Movie ticket pricing

let movieType = "3D IMAX";

switch (movieType) {
  case "3D IMAX":
  case "4DX":
    console.log("Ticket: ₹500 - Prepare your wallet!");
    break;
  case "3D":
    console.log("Ticket: ₹300 - Not too bad");
    break;
  case "2D":
    console.log("Ticket: ₹150 - Budget-friendly!");
    break;
  default:
    console.log("Unknown format - check the counter");
}
// Output: Ticket: ₹500 - Prepare your wallet!

When to Use switch vs if-else

Use switch when:

• You're checking one variable against multiple exact values

• The values are simple (numbers or strings)

• You have many possible values to check

let color = "red";

switch (color) {
  case "red":
    console.log("Stop");
    break;
  case "yellow":
    console.log("Slow down");
    break;
  case "green":
    console.log("Go");
    break;
}

Use if-else when:

• You need to check complex conditions

• You're checking greater than / less than values

• Using logical operators (&&, ||, !)

let age = 25;
let hasLicense = true;

if (age >= 18 && hasLicense) {
  console.log("You can drive");
} else if (age >= 18 && !hasLicense) {
  console.log("Get a license first");
} else {
  console.log("You're too young to drive");
}

Quick Comparison:

Feature	switch	if-else
Best for	Exact value matching	Ranges, complex conditions
Readability	Cleaner with many values	Cleaner with ranges
Performance	Slightly faster (many cases)	Similar performance
Flexibility	Limited	Very flexible

Practical Assignment

1. Check if a number is positive, negative, or zero. (let number = -5; )

2. Print day of the week using switch (let dayNumber = 4;)

3. Explain which control structure you used and why

Control flow helps your program make decisions instead of running every line blindly. Using if, else, and switch, JavaScript can choose what to do based on different situations — just like we do in real life every day.