JavaScript Switch

Handling multiple conditions with switch statements

🔀 What is a Switch Statement?

The switch statement is used to perform different actions based on different conditions. It's a cleaner alternative to multiple if-else statements. 


// Basic switch example
let day = "Monday";
switch (day) {
    case "Monday":
        console.log("Start of work week!");
        break;
    case "Friday":
        console.log("TGIF!");
        break;
    default:
        console.log("Regular day");
}

Output:

Start of work week!

Switch Statement Components

switch

Switch Keyword

Starts the switch statement 

switch (expression) {}
case

Case Labels

Define possible values 

case "value":
  // code
break

Break Statement

Exits the switch block 

break;
default

Default Case

Fallback when no case matches 

default:
  // fallback code

🔹 Basic Switch Statement

A simple switch statement with multiple cases: 

let grade = "B";

switch (grade) {
    case "A":
        console.log("Excellent work!");
        break;
    case "B":
        console.log("Good job!");
        break;
    case "C":
        console.log("You can do better!");
        break;
    case "D":
        console.log("Need improvement!");
        break;
    case "F":
        console.log("Failed. Study harder!");
        break;
    default:
        console.log("Invalid grade!");
}

Output:

Good job!

🔹 Switch with Numbers

Switch statements work with numbers too: 

let month = 3;

switch (month) {
    case 1:
        console.log("January");
        break;
    case 2:
        console.log("February");
        break;
    case 3:
        console.log("March");
        break;
    case 4:
        console.log("April");
        break;
    default:
        console.log("Other month");
}

// Calculator example
let operation = "+";
let a = 10;
let b = 5;
let result;

switch (operation) {
    case "+":
        result = a + b;
        break;
    case "-":
        result = a - b;
        break;
    case "*":
        result = a * b;
        break;
    case "/":
        result = a / b;
        break;
    default:
        result = "Invalid operation";
}

console.log("Result:", result);

Output:

March

Result: 15

🔹 Fall-through Cases

When you omit break, cases "fall through" to the next one: 

let day = "Saturday";

switch (day) {
    case "Monday":
    case "Tuesday":
    case "Wednesday":
    case "Thursday":
    case "Friday":
        console.log("It's a weekday");
        break;
    case "Saturday":
    case "Sunday":
        console.log("It's weekend!");
        break;
    default:
        console.log("Invalid day");
}

// Season example
let month = "December";

switch (month) {
    case "December":
    case "January":
    case "February":
        console.log("Winter season");
        break;
    case "March":
    case "April":
    case "May":
        console.log("Spring season");
        break;
    case "June":
    case "July":
    case "August":
        console.log("Summer season");
        break;
    default:
        console.log("Fall season");
}

Output:

It's weekend!

Winter season

🔹 Switch vs If-Else

Comparing switch with equivalent if-else statements: 

// Using switch
let color = "red";
switch (color) {
    case "red":
        console.log("Stop!");
        break;
    case "yellow":
        console.log("Caution!");
        break;
    case "green":
        console.log("Go!");
        break;
    default:
        console.log("Unknown signal");
}

// Equivalent if-else
if (color === "red") {
    console.log("Stop!");
} else if (color === "yellow") {
    console.log("Caution!");
} else if (color === "green") {
    console.log("Go!");
} else {
    console.log("Unknown signal");
}

// Switch is cleaner for many conditions!

Output:

Stop!

Stop!

🔹 Practical Examples

Real-world applications of switch statements: 

// Menu system
let userChoice = "2";

switch (userChoice) {
    case "1":
        console.log("You selected: View Profile");
        break;
    case "2":
        console.log("You selected: Edit Settings");
        break;
    case "3":
        console.log("You selected: Logout");
        break;
    default:
        console.log("Invalid choice. Please try again.");
}

// HTTP status codes
let statusCode = 404;

switch (statusCode) {
    case 200:
        console.log("Success: Request completed");
        break;
    case 404:
        console.log("Error: Page not found");
        break;
    case 500:
        console.log("Error: Server error");
        break;
    default:
        console.log("Unknown status code");
}

Output:

You selected: Edit Settings

Error: Page not found

🧠 Test Your Knowledge

What happens if you forget the 'break' statement in a switch case?