Skip to main content

Command Palette

Search for a command to run...

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

Published
4 min read
Control Flow in JavaScript: If, Else, and Switch Explained

Every program eventually needs to make decisions.

Should a user be allowed to log in?
Did a student pass the exam?
Is a number positive or negative?

Programs are not just a list of instructions executed one after another. Sometimes the program must choose what to do next based on a condition. This is where control flow comes in.

Control flow determines which part of the code runs and which part gets skipped depending on certain conditions.

In JavaScript, the most common tools for controlling program flow are:

  • if

  • if...else

  • else if

  • switch

Let’s go through them step by step.


What Control Flow Means in Programming

Think about a simple real-life situation.

Imagine checking your exam result:

  • If marks are greater than or equal to 40 → Pass

  • Otherwise → Fail

This is essentially a decision-making process, and programming languages work the same way.

A program evaluates a condition, and depending on whether that condition is true or false, it decides which instructions to run.

This process of directing the execution of a program is called control flow.


The if Statement

The if statement is the simplest form of decision-making in JavaScript. It runs a block of code only if a condition is true.

Example:

let age = 20;

if (age >= 18) {
  console.log("You are allowed to vote.");
}

How this runs:

  1. The program checks the condition age >= 18.

  2. If the condition is true, the code inside the curly braces runs.

  3. If the condition is false, the code inside the block is skipped.

Since age is 20 in this example, the condition is true, so the message will be printed.


The if...else Statement

Sometimes you want to handle both possibilities—when the condition is true and when it is false.

That’s where else comes in.

Example:

let marks = 35;

if (marks >= 40) {
  console.log("You passed the exam.");
} else {
  console.log("You failed the exam.");
}

Step-by-step execution:

  1. The program checks whether marks >= 40.

  2. If true → it runs the if block.

  3. If false → it runs the else block.

Since the marks are 35, the program prints "You failed the exam."


The else if Ladder

In many situations, there are more than two possible outcomes. In that case, we can add additional conditions using else if.

Example: grading system

let marks = 82;

if (marks >= 90) {
  console.log("Grade A");
} 
else if (marks >= 75) {
  console.log("Grade B");
} 
else if (marks >= 50) {
  console.log("Grade C");
} 
else {
  console.log("Fail");
}

How the program evaluates this:

  1. Check if marks >= 90. If true, stop.

  2. If not, check if marks >= 75.

  3. Continue down the list until a condition becomes true.

Only the first matching condition runs, and the rest are skipped.

For marks = 82, the second condition becomes true, so the program prints "Grade B."


The switch Statement

A switch statement is useful when you want to compare one variable against multiple specific values.

Instead of writing many else if statements, switch can make the code cleaner and easier to read.

Example: printing the 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;

  default:
    console.log("Weekend");
}

The program checks the value of day and compares it with each case.

When it finds a match, it runs that block of code.

Since day = 3, the output will be "Wednesday."


Why break is Important in switch

Inside a switch statement, the break keyword stops execution once a case has matched.

Without break, JavaScript continues executing the next cases even if they do not match.

Example:

let day = 2;

switch(day) {
  case 1:
    console.log("Monday");
  case 2:
    console.log("Tuesday");
  case 3:
    console.log("Wednesday");
}

Output:

Tuesday
Wednesday

This happens because execution falls through to the next case. Adding break prevents this and ensures only the correct block runs.


When to Use switch vs if-else

Both switch and if-else are used for decision-making, but they are better suited for different situations.

Use if-else when:

  • Conditions involve ranges

  • Logical operators are involved

  • Comparisons are more complex

Example:

if (marks >= 75)

Use switch when:

  • One variable is being compared

  • You are checking for specific values

Example:

switch(day)

In simple terms:

  • Use if-else for flexible conditions.

  • Use switch when comparing one value against many fixed options.