JavaScript Switch Case — PBA Institute Tutorial
Chapter 08 · JavaScript Programming Series
12 min read Beginner

JavaScript Switch Case Statement

When you need to compare one value against many fixed options, the switch statement is cleaner than a long if-else-if chain. It also makes the code easier to read.

What is Switch Case?

switch is a control statement that checks a value against a list of case options. When a case matches, that block runs. The default case runs if no case matches.

Why Use Switch Case?

📜

Cleaner Code

Better than a chain of else-if when comparing one value.

Faster Reading

Cases sit one below the other — easy to scan.

🎯

Strict Match

Uses === (strict equality) for comparison.

🛑

break

Ends a case and exits the switch block.

⤵️

Fall-through

Without break, the next case also runs — useful for groups.

🛟

default

Safety net when no case matches.

Basic Features

  • Switch compares using ===, so types must match.
  • break is needed after each case unless intentional fall-through.
  • Multiple cases can share the same code by stacking them without break.
  • default can appear anywhere but is usually last.

Switch Case in JavaScript

A switch statement in JavaScript is a control flow statement used to execute different blocks of code based on multiple possible conditions. It is cleaner and more organized than writing many if-else statements.

What is Switch Case ?

The switch statement checks the value of an expression and matches it with different case values. If a match is found, the corresponding code block executes.

  • Used for multiple conditions.
  • Improves readability.
  • Cleaner than long if-else chains.
  • Supports default conditions.

Structure of Switch Case

switch Syntax
switch(expression){

    case value1:

        // statements
        break;

    case value2:

        // statements
        break;

    default:

        // default statements

}

Why Switch Case is Used ?

  • Makes code easier to read.
  • Better organization of conditions.
  • Faster for many comparisons.
  • Supports default fallback option.
  • Easier maintenance of code.

Your First Switch Program

Day of Week Program
<script>

let day = 3;

switch(day){

    case 1:
    document.write(
    "Monday"
    );
    break;

    case 2:
    document.write(
    "Tuesday"
    );
    break;

    case 3:
    document.write(
    "Wednesday"
    );
    break;

    default:
    document.write(
    "Weekend"
    );

}

</script>
Output Wednesday

Example 1 : Fruit Taste

Fruit Taste Program
<script>

var fruit = "banana";

var taste;

switch(fruit){

    case "banana":

    taste = "sweet";

    break;

    case "lemon":

    taste = "sour";

    break;

    case "apple":

    taste = "crisp";

    break;

    default:

    taste = "unknown";

}

document.write(

"The taste of "

+ fruit +

" is "

+ taste

);

</script>
Output The taste of banana is sweet

Example 2 : Weekday Program

Print Weekdays
<script>

var ch = 2;

switch(ch){

    case 1:

    document.write(
    "Sunday"
    );

    break;

    case 2:

    document.write(
    "Monday"
    );

    break;

    case 3:

    document.write(
    "Tuesday"
    );

    break;

    default:

    document.write(
    "Invalid Choice"
    );

}

</script>
Output Monday

Example 3 : Calculator

Calculator Using Switch
<script>

let a = 10;

let b = 5;

let op = "*";

switch(op){

    case "+":

    document.write(
    a+b
    );

    break;

    case "-":

    document.write(
    a-b
    );

    break;

    case "*":

    document.write(
    a*b
    );

    break;

    case "/":

    document.write(
    a/b
    );

    break;

    default:

    document.write(
    "Invalid"
    );

}

</script>
Output 50

Example 4 : Grade System

Grade Using Switch
<script>

let marks = 78;

let grade =

Math.floor(

marks / 10

);

switch(grade){

    case 10:

    case 9:

    document.write(
    "A+"
    );

    break;

    case 8:

    document.write(
    "A"
    );

    break;

    case 7:

    document.write(
    "B"
    );

    break;

    default:

    document.write(
    "Fail"
    );

}

</script>
Output B

Example 5 : Vowel or Consonant

Vowel Checker
<script>

let ch = "e";

switch(ch){

    case "a":

    case "e":

    case "i":

    case "o":

    case "u":

    document.write(

    ch +
    " is vowel"

    );

    break;

    default:

    document.write(

    ch +
    " is consonant"

    );

}

</script>
Output e is vowel

Example 6 : VIBGYOR Colours

Spectrum Colour Program
<script>

var ch = "g";

switch(ch){

    case "v":

    document.write(
    "violet"
    );

    break;

    case "g":

    document.write(
    "green"
    );

    break;

    case "r":

    document.write(
    "red"
    );

    break;

    default:

    document.write(
    "Invalid"
    );

}

</script>
Output green

Important Notes

  • Always use break statements.
  • switch uses strict equality.
  • default is optional but useful.
  • Multiple cases can share one block.

Real-Life Use Cases

🌐

Menu Routing

Route users to different pages.

🛒

Order Status

Show delivery status updates.

🎮

Game Levels

Change effects based on level.

Frequently Asked Questions

Question Answer
Can switch compare strings? Yes, strings and numbers both work.
What happens without break? Execution falls to next case.
Is default necessary? No, but recommended.

Conclusion

The switch statement is a clean and powerful way to compare one value against multiple conditions. It improves readability, structure, and maintainability of JavaScript code.

JavaScript All Chapters

Continue Learning

Previous

Go to Math Function Chapter

Next

Go to Date Time Function Chapter