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

life is basically just one long string of decisions. if it’s raining, you grab an umbrella. if you’re tired, you drink chai. if your battery hits 5%, you panic and look for a charger.

programming works the exact same way. by default, code is a bit "dumb"—it just runs from top to bottom like a waterfall.

but real apps need to make choices.

that’s where control flow comes in. it’s the steering wheel that tells your code which path to take.

why did control flow even come?

without control flow, your code would be a mindless robot. imagine an instagram where the "delete" button worked for everyone, even if they didn't own the post. or an atm that gave out cash even if you had zero balance.

we need code that can ask a question ("is this user logged in?") and act differently based on the answer. it's what makes an app feel "smart" and interactive.

1. the if statement: the "only if" rule

this is the simplest version of a decision. it’s like telling a friend: "if you pass the bakery, buy some cookies." if they don't pass the bakery, they do nothing and just come home.

how to use it:

let age = 20;

if (age >= 18) {
  console.log("you’re officially an adult. congrats!");
}

2. the if-else statement: the "fork in the road"

in the real world, we usually have a backup plan. if the first thing isn't true, we do the second thing.

• scenario: if you have a ticket, you get into the movie. else, you go to the ticket counter.

let marks = 35;

if (marks >= 40) {
  console.log("you passed!");
} else {
  console.log("time for a re-test.");
}

3. the else if ladder: the "multiple choices"

sometimes life isn't just "yes" or "no." sometimes you have a bunch of options, like a traffic light or grading a student.

let signal = "yellow";

if (signal === "red") {
  console.log("stop right there!");
} else if (signal === "yellow") {
  console.log("slow down and prepare to stop.");
} else if (signal === "green") {
  console.log("go go go!");
} else {
  console.log("wait, that’s not a normal signal...");
}

why it’s important: it prevents the computer from checking every single condition. once it finds that the signal is "yellow," it stops looking and ignores the rest of the ladder. it saves energy!

4. the switch statement: the "organized menu"

imagine you are at a restaurant with 10 different pizza options. using an else if ladder for 10 items would look like a giant, messy wall of text.

switch is a cleaner way to handle many specific "cases." it’s like a vending machine—you press button #2, and you get the item for #2.

let day = 2;

switch (day) {
  case 1:
    console.log("it's monday. back to work.");
    break;
  case 2:
    console.log("it's tuesday. getting into the groove.");
    break;
  case 3:
    console.log("it's wednesday. hump day!");
    break;
  default:
    console.log("it's just another day.");
}

the importance of break

think of break like the exit door of a shop. without it, once javascript finds a match, it will keep running every single case below it (this is called "falling through").

if you forgot the break on case 2, it would print "it's tuesday" and "it's wednesday." always remember to shut the door!