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

Imagine it’s a sunny Sunday morning in Muzaffarpur.
You and your friend Nishar are super excited. You both put on backpacks, wear caps, and start a small hike to the nearby hill. There is a rumor of a “treasure” at the top — actually a beautiful viewpoint with cool wind and birds singing.

But the path is not straight.
At every turn you have to decide:
“Go left or right?”
“Fight or run?”
“Open the chest or take detour?”

These decisions are exactly what control flow is in JavaScript.

Control flow is like the map in your hand. It tells the code:
“Check this condition… now choose the right path… and keep going!”

Without it, your code would do the same thing again and again — like walking in a circle forever. Boring!

Let’s go on this hike with Nishar and learn step by step. Just like the fun map you saw.

1. What is Control Flow? (The Crossroads)

You reach the first big crossing.

Left path: Sunny and easy
Right path: Rainy and slippery

You look at the sky and decide.

In JavaScript this is called the Path of Execution.
The code starts at the top and moves step by step, but at every “crossroad” it asks a question and chooses the next line.

2. The “if” Statement – Simple Check

Nishar points at a box on the path and says:
“If this box says Treasure, open it!”

Here is the code:

JavaScript

let place = "Treasure";

if (place === "Treasure") {
  console.log("Yay! Open the chest! You found the beautiful view!");
}

• The code checks the condition.

• If true → it runs the lines inside { }.

• If false → it skips and continues walking.

Super simple, just like checking “If I have money, buy cold coffee.”

3. The “if-else” Statement – Two Clear Paths

Now you see a locked door on the trail.

Nishar says:
“If I have the key, open the door. Else, take the long detour.”

Code:

JavaScript

let hasKey = true;

if (hasKey) {
  console.log("Door unlocked! We go straight.");
} else {
  console.log("No key… we take the detour.");
}

• True path = one way

• False path = another way

• Always one of them will run.

4. The “else if” Ladder – Many Choices

Suddenly a small monster appears (not scary, just for fun!).

Nishar checks his strength:

• If strength > 100 → fight the big dragon

• Else if strength > 50 → fight the troll

• Else → fight the small goblin

Code (this is the famous ladder):

JavaScript

let strength = 65;

if (strength > 100) {
  console.log("Wow! You defeated the Dragon!");
} else if (strength > 50) {
  console.log("Good job! You beat the Troll.");
} else {
  console.log("Careful… you fight the Goblin.");
}

The code checks from the top.
The first true condition wins.
All others are ignored.

Just like choosing the right road when there are 3-4 options.

5. The “switch” Statement – The Magic Menu

You reach a funny machine with buttons A, B, C.

Nishar presses one and says:
“Press A = go to forest, B = go to volcano, C = stay here.”

Code:

JavaScript

let button = "B";

switch (button) {
  case "A":
    console.log("Teleport to the green forest!");
    break;
  case "B":
    console.log("Teleport to the hot volcano!");
    break;
  case "C":
    console.log("Stay here safely.");
    break;
  default:
    console.log("Wrong button! Try again.");
}

Important tip: Always write break; after each case.
If you forget, the code will keep running the next lines too (called “fall-through” — the map says it’s a mistake!).

6. When to Use switch vs if-else?

• Use if / else if when you have ranges or comparisons Example: age > 18, marks between 80-90, strength > 50

• Use switch when you have exact fixed choices Example: days of the week, menu options, A B C buttons

Switch looks cleaner when there are 4 or more exact options.

Your 5-Minute Assignment (Do it now!)

Open your browser console (right click → Inspect → Console) and try these:

1. Number Checker (use if-else)

JavaScript

let number = 0;   // change this to 7 or -3

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

2. Day of the Week (use switch)

JavaScript

let day = 4;   // change 1 to 7

switch (day) {
  case 1: console.log("Sunday - Holiday!"); break;
  case 2: console.log("Monday"); break;
  case 3: console.log("Tuesday"); break;
  case 4: console.log("Wednesday"); break;
  case 5: console.log("Thursday"); break;
  case 6: console.log("Friday"); break;
  case 7: console.log("Saturday - Weekend!"); break;
  default: console.log("Not a valid day");
}

Run both and tell me in comments:
Which one did you like more and why?

Control flow is the real magic that makes your code think and decide — just like you and Nishar choosing the best path on your hike.

Once you master if, else, and switch, you can build games, calculators, login systems, and even your own coffee shop app!

Now it’s your turn.
Go on your own little hike with code today.

#chaiaurcode #javascript #beginners #controlflow #ifelse #switch #hashnode