Control Flow in JavaScript: if-else and switch Explained

Every program you write needs to make decisions. Should this user see the dashboard or the login page? Is the score high enough to pass? What day of the week is it? Control flow is how you teach your program to choose different paths based on different conditions.

What Is Control Flow?

By default, JavaScript runs your code line by line, from top to bottom. Control flow lets you change that — skipping some lines, repeating others, or branching into completely different paths depending on what is true at that moment.

Think of it like a road with forks. Depending on a condition, your code takes one path or another.

Start
  |
  v
[Condition?]
  |        |
 Yes       No
  |        |
 Path A   Path B
  |        |
  v        v
Continue...

The if Statement

The simplest form of control flow. If a condition is true, run the code inside. If not, skip it entirely.

let age = 20;

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

If age were 15, nothing would print — the block is simply skipped.

The if-else Statement

Use else to handle what happens when the condition is false.

let age = 15;

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

One condition, two possible outcomes. Only one block ever runs.

[age >= 18?]
  |        |
 true    false
  |        |
"adult"  "minor"

The else if Ladder

When you have more than two possible outcomes, chain conditions using else if.

let 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");
}
// "Grade: C"

JavaScript checks each condition from top to bottom. The moment one is true, it runs that block and skips the rest. The final else is the fallback — it runs only if nothing above was true.

Step by step for marks = 72:

• Is 72 >= 90? No, move on.

• Is 72 >= 75? No, move on.

• Is 72 >= 60? Yes — print "Grade: C" and stop.

The switch Statement

switch is a cleaner alternative when you are checking one variable against multiple exact values.

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;
  default:
    console.log("Weekend");
}
// "Wednesday"

The switch statement checks the value of day against each case. When it finds a match, it runs that block and stops.

Why break matters

Without break, JavaScript does not stop at the matched case — it keeps running every case below it. This is called fall-through.

let day = 2;

switch (day) {
  case 1:
    console.log("Monday");
  case 2:
    console.log("Tuesday");  // matches here
  case 3:
    console.log("Wednesday"); // runs anyway — no break above!
}
// "Tuesday"
// "Wednesday"

Always add break at the end of each case unless you intentionally want fall-through behavior.

The default case

default works like the else in an if-else chain. It runs when no case matches.

let color = "purple";

switch (color) {
  case "red":
    console.log("Red selected");
    break;
  case "blue":
    console.log("Blue selected");
    break;
  default:
    console.log("Unknown color");
}
// "Unknown color"

Switch Branching at a Glance

switch (value)
  |
  |--- case 1 --> action --> break
  |--- case 2 --> action --> break
  |--- case 3 --> action --> break
  |--- default --> fallback action

if-else vs switch — When to Use Which

A practical rule: if you are comparing one variable to a list of specific values, switch is the cleaner choice. If you are working with ranges, multiple variables, or complex conditions, stick with if-else.

Putting It All Together

let score = 85;
let grade;

if (score >= 90) {
  grade = "A";
} else if (score >= 75) {
  grade = "B";
} else if (score >= 60) {
  grade = "C";
} else {
  grade = "F";
}

console.log("Grade:", grade); // "Grade: B"

// Now print a message based on the grade using switch
switch (grade) {
  case "A":
    console.log("Outstanding performance.");
    break;
  case "B":
    console.log("Good work, keep it up.");
    break;
  case "C":
    console.log("You passed. Aim higher next time.");
    break;
  default:
    console.log("You need to work harder.");
}
// "Good work, keep it up."

Practice Assignment

Work through both programs to practice what you have learned:

1. Check if a number is positive, negative, or zero:

let number = -7;

if (number > 0) {
  console.log("The number is positive.");
} else if (number < 0) {
  console.log("The number is negative.");
} else {
  console.log("The number is zero.");
}
// "The number is negative."

Why if-else here? Because you are checking ranges and relationships (> 0, < 0), not exact values. switch cannot handle that cleanly.

2. Print the day of the week using switch:

let dayNumber = 5;

switch (dayNumber) {
  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 number.");
}
// "Friday"

Why switch here? Because you are matching one variable (dayNumber) against a list of exact values. That is exactly what switch is designed for — and it reads far more cleanly than a long else if chain.

Quick Recap

• Control flow controls which parts of your code run and when

• Use if when you have a single condition to check

• Use if-else for two possible outcomes

• Use else if to handle multiple conditions in sequence

• Use switch when comparing one variable against multiple exact values

• Always add break at the end of each switch case to prevent fall-through

• default in switch and else in if-else serve the same purpose — they are the fallback

Understanding control flow is one of the most important skills you will build as a developer. Once this feels natural, you will find yourself writing cleaner logic in every program you create.

Happy coding! 🚀

If you enjoyed this article, check out my other blogs on this profile. 🔗 Connect with me: LinkedIn | GitHub | X (Twitter)