Skip to main content

Command Palette

Search for a command to run...

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

Updated
6 min read
Control Flow in JavaScript: If, Else, and Switch Explained

In the previous blog, we explored the basics of operators in JavaScript and how they help us perform different operations on values.

JS Operators

In this blog, we are going to learn about control flow statements in JavaScript. Control flow refers to controlling the flow of the program execution. By default the program flow is line by line.

So when we want to control the flow of a program we use control flow statements.

So on the basis of some condition we can execute or skip a block of code.

There are few statements we are gonna learn:

  • IF

  • IF-ELSE

  • IF-ELSE-IF

  • Switch

IF Statement:

The if block contains the body and condition block if the condition inside the condition block is true the code written inside the body is executed otherwise skipped.

//Syntax

if( condition ){
//body
}

let take a example to understand if :

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

//Output
you can vote

let take one more example to understand if statement better, suppose you run a clothing brand and you are giving 10% discount to person who have a coupon code otherwise no discount and you have to calculate the final price.

let bill=2000;
let coupon_code="SAVE10";
if(coupon_code==="SAVE10"){
bill = bill - bill * 0.10;
}
console.log(bill);

//Output 
1800

The user has the coupon code which matches with our coupon code so user can get 10% discount and now let see a example where user not get discount if he don't have a coupon code.

let bill=2000;
let coupon_code=""
if(coupon_code==="SAVE10"){
bill = bill - bill * 0.10;
}
console.log(bill)

//Output 
2000

Here, the user doesn’t have a coupon code. The empty string does not match the required coupon value, so the discount is not applied.

IF-ELSE Statement:

IF-ELSE is used to make decisions in code.
It runs different blocks of code depending on whether a condition is true or false.

If the condition inside the if conditions block is true then

const age=17;
if(age>=18){
console.log("you can vote")
}
else{
console.log("you can not vote")
}

//Output
you can not vote

If the condition inside the if is true then execute the body of if block other wise run the code written inside the else block . In the above code if age is greater than or equal to 18 then print you can vote and else print you can not vote.

ELSE-IF ladder:

The else if ladder is used when we have to execute different block of code based on different conditions. Let’s take an example where we check whether one number is greater than, less than, or equal to another number.

let a=5;
let b=6;
if(a>b){
console.log(" a is greater than b ")
}
else if(a<b){
console.log("a is lesser than b")
}else{
console.log("a is equal to b")
}

//Output
a is lesser than b

let understand this if-else ladder with a cafe shop example where you are selling a cup of coffee in three sizes and on the base of size of cup you have to calculate price.

let price;
let cup_size="medium"
if(cup_size==="small"){
price=50;
}
else if(cup_size==="medium"){
price=100;
}
else if(cup_size==="large"){
price=150;
}
else{
console.log("Invalid cup size")
}
console.log("The final price for your  a cup of coffee is ",price)
//Output
The final price for your  a cup of coffee is 100

here we have compared the cup_size and on the base of it we have decided the price.

Switch Statement:

The switch statement is used as alternate for a long if-else ladder. Let's firs understand the syntax of switch .

switch(expression) {
  case value1:
    // code
    break;

  case value2:
    // code
    break;

  default:
    // code
}

Explanation

  • expression → the value you want to check

  • case → possible matches for that value

  • break → stops execution after a match

  • default → runs when no case matches

let day = 2;

switch(day){
  case 1:
    console.log("Sunday");
    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");
    break;

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

//Output
Monday

The switch matches the day value with every case value if it matches switch executes the body of that case and no case matches then the default case is executed.

When to use switch and when if-else statement?

When you have just one variables to compare you can use switch but when you have logical condition don't use switch use if -else because in that case using switch become very complex. Let understand with a example which one is suitable for what condition.

Suppose you are running a gym and you offers different subscription plans like gold, silver and if festival's are ongoing and you have to offers discount to your customer based on their membership if customer has gold membership then he will get 30% discount and if customer has silver membership will get 20% discount and the customer not has membership will get 0% discount on festivals so let try to implement the billing system for your gym using both if-else and switch.

let membershipType = "Gold";
let isFestival = true;

if (membershipType === "Gold" && isFestival === true) {
  console.log("30% Discount");
} else if (membershipType === "Silver" && isFestival === true) {
  console.log("20% Discount");
} else if (membershipType === "Gold") {
  console.log("10% Discount");
} else {
  console.log("No Discount");
}

USING SWITCH STATEMENT:

let membershipType = "Gold";
let isFestival = true;

switch (true) {
  case membershipType === "Gold" && isFestival === true:
    console.log("30% Discount");
    break;

  case membershipType === "Silver" && isFestival === true:
    console.log("20% Discount");
    break;

  case membershipType === "Gold":
    console.log("10% Discount");
    break;

  default:
    console.log("No Discount");
}

so as we see both way to write the program in this case using if-else is easy and less complex . so now i hope you understand when to use switch and if-else.

Conclusion:

In this blog, we learned how control flow statements help us control the execution of a JavaScript program instead of running it line by line. We explored if, if-else, else-if ladder, and switch statements with practical examples to understand how decisions are made in real-world scenarios like discounts, voting eligibility, coffee pricing, and gym memberships.

We understood that:

  • if is used when we want to execute code only if a condition is true.

  • if-else helps us choose between two possibilities.

  • else-if ladder is useful when we have multiple conditions to check.

  • switch is best when comparing one variable against multiple fixed values.

Most importantly, we learned when to choose between if-else and switch.
If your logic involves multiple variables or logical operators (&&, ||), if-else is usually clearer and easier to understand. If you are comparing a single variable with different possible values, switch makes the code cleaner and more organized.

Understanding control flow is a fundamental step in programming because it allows us to build real decision-making systems in our applications.

Now that you know how to control program flow, you are ready to write smarter and more dynamic JavaScript programs .