Conditionals in JavaScript

Introduction

Programming isn’t just about writing code — it’s about making decisions.

Just like in real life:

• If it is raining → take an umbrella

• If it is late → take a cab

• If it is weekend → relax

Computers also make decisions using something called control flow.

In this article, we’ll learn how JavaScript decides which code to run and which code to skip.

---

What is Control Flow in Programming?

Control flow means:

The order in which a program executes instructions.

Normally, programs run top → bottom.

Example:

console.log("Step 1");
console.log("Step 2");
console.log("Step 3");

Output

Step 1
Step 2
Step 3

But real programs need decisions.

Example:

• If user is logged in → show dashboard

• Otherwise → show login page

To control these decisions, we use conditional statements.

The most common ones in JavaScript are:

• if

• if-else

• else if

• switch

---

The if Statement

The if statement runs code only when a condition is true.

Syntax

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

Example

let age = 20;

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

How it works

1. JavaScript checks age >= 18

2. If it is true, the block runs

3. If it is false, the block is skipped

Output

You can vote.

---

The if-else Statement

Sometimes we want two different outcomes.

Example:

• If marks ≥ 40 → Pass

• Else → Fail

Syntax

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

Example

let marks = 35;

if (marks >= 40) {
  console.log("Pass");
} else {
  console.log("Fail");
}

Step-by-step execution

1. JavaScript checks marks >= 40

2. The condition is false

3. The program jumps to the else block

Output

Fail

---

The else if Ladder

Sometimes there are many possible outcomes.

Example:

• marks ≥ 90 → Grade A

• marks ≥ 75 → Grade B

• marks ≥ 50 → Grade C

• otherwise → Fail

Example

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");
}

Output

Grade B

How JavaScript evaluates this

JavaScript checks conditions from top to bottom.

1. marks >= 90 → false

2. marks >= 75 → true

3. Code runs → "Grade B"

4. Remaining conditions are skipped

---

The switch Statement

The switch statement is useful when we compare one variable against many fixed values.

Instead of checking conditions one by one, JavaScript directly jumps to the matching case.

Syntax

switch (value) {

  case value1:
    // code
    break;

  case value2:
    // code
    break;

  default:
    // code
}

---

Understanding case and default

The case Keyword

case represents a possible value the variable might match.

If the switch variable equals the case value, the code inside that case executes.

Example

case 1:
  console.log("Monday");

If the variable equals 1, JavaScript runs this block.

---

The default Keyword

default runs when none of the cases match.

It works like the else block in an if-else statement.

Example

default:
  console.log("Invalid day");

This ensures that the program still handles unexpected input.

---

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

How the switch executes

Instead of checking many conditions like if-else, JavaScript directly jumps to the matching case.

---

Why break is Important

The break statement stops the switch execution.

Without it, JavaScript continues executing the next cases.

Example without break:

let day = 1;

switch (day) {

  case 1:
    console.log("Monday");

  case 2:
    console.log("Tuesday");

  case 3:
    console.log("Wednesday");
}

Output

Monday
Tuesday
Wednesday

This behavior is called fall-through.

The break keyword prevents this.

---

When to Use switch vs if-else

Use if-else when

• Conditions involve ranges

Example

if (marks >= 90)

---

Use switch when

• Comparing one variable against multiple fixed values

Example

switch(day)

---

Assignment Practice

Try solving these problems.

Program 1: Check if Number is Positive, Negative, or Zero

let number = -5;

if (number > 0) {
  console.log("Positive number");
}
else if (number < 0) {
  console.log("Negative number");
}
else {
  console.log("Zero");
}

Why we used if-else:

Because we are checking ranges, not exact values.

Program 2: Print Day of Week Using Switch

let day = 5;

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 input");
}

Why we used switch:

Because we compare one variable with many exact values.

---

Conclusion

Control flow allows programs to make decisions.

In this article we learned:

• if → run code when a condition is true

• if-else → choose between two outcomes

• else if → handle multiple conditions

• switch → compare one variable with multiple values

• case → defines each possible match

• default → runs if no case matches

• break → stops switch execution

These concepts form the foundation of program logic.

Almost every real-world application — login systems, dashboards, games — relies on control flow.

---

Explore More

Let’s go one step deeper.

Problem: Student Result Using Nested If-Else

Rules:

• Marks ≥ 40 → Pass

• Marks < 40 → Fail

If the student passes:

• ≥ 75 → Distinction

• ≥ 60 → First Class

• ≥ 50 → Second Class

• Otherwise → Pass Class

Code Example

let marks = 68;

if (marks >= 40) {

  console.log("Student Passed");

  if (marks >= 75) {
    console.log("Distinction");
  }
  else if (marks >= 60) {
    console.log("First Class");
  }
  else if (marks >= 50) {
    console.log("Second Class");
  }
  else {
    console.log("Pass Class");
  }

} else {

  console.log("Student Failed");

}

What is happening here?

We placed an if-else ladder inside another if statement.

This is called a nested if-else.

It allows us to:

1. First check if the student passed

2. Then determine which class category

---

Your Turn !!!

We saw nested if-else.

Now try exploring something interesting:

Does nested switch also exist in JavaScript?

Try writing a switch inside another switch and see if it works.