Control Flow in JavaScript: If, Else, and Switch Explained
When writing programs in JavaScript, we often need the program to make decisions.
For example:
If a user is logged in, show the dashboard
If a student’s marks are above 40, they pass
If today is Monday, display the schedule
This decision-making process is called control flow.
Control flow determines which code runs and when it runs.
What Control Flow Means in Programming
Control flow refers to the order in which statements are executed in a program.
Sometimes code runs line by line, but sometimes we need conditions.
Example:
let age = 20;
if (age >= 18) {
console.log("You can vote");
}
Here, the program checks a condition before running the code.
The if Statement
The if statement executes code only if a condition is true.
Syntax
if (condition) {
// code runs if condition is true
}
Example
let marks = 75;
if (marks >= 40) {
console.log("You passed the exam");
}
Step-by-step execution
Condition checked →
marks >= 40If true, code runs
If false, nothing happens
Output
You passed the exam
The if-else Statement
Sometimes we want two possible outcomes.
One if the condition is true
Another if the condition is false
Syntax
if (condition) {
// runs if true
} else {
// runs if false
}
Example
let age = 16;
if (age >= 18) {
console.log("You can vote");
} else {
console.log("You cannot vote yet");
}
Output
You cannot vote yet
The else if Ladder
Sometimes we need to check multiple conditions.
Example: grading system.
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");
}
How it works
The program checks conditions from top to bottom.
marks >= 90→ falsemarks >= 75→ true
So the output is:
Grade B
Once a condition becomes true, the rest of the ladder stops executing.
The switch Statement
The switch statement is used when we want to compare one value against multiple possible cases.
Syntax
switch(value) {
case value1:
// code
break;
case value2:
// code
break;
default:
// fallback
}
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;
default:
console.log("Weekend");
}
Output
Wednesday
Why break is Important
Without break, the program continues executing all remaining cases.
Example without break:
let day = 1;
switch(day) {
case 1:
console.log("Monday");
case 2:
console.log("Tuesday");
}
Output
Monday
Tuesday
This happens because execution falls through to the next case.
So we use break to stop the execution.
When to Use switch vs if-else
| Situation | Best Choice |
|---|---|
| Checking ranges (marks, age) | if-else |
| Multiple fixed values | switch |
| Complex conditions | if-else |
| Clean menu-style logic | switch |
Example:
Checking marks → use if-else
Checking weekday → use switch
Assignment Practice
1️⃣ Check if a Number is Positive, Negative, or Zero
let num = -5;
if (num > 0) {
console.log("Positive number");
}
else if (num < 0) {
console.log("Negative number");
}
else {
console.log("Zero");
}
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;
default:
console.log("Weekend");
}
Why These Structures Were Used
if-else was used for number checking because we are dealing with conditions and ranges.
switch was used for days of the week because we are matching specific values.