Microbit JavaScript
Advanced
25 mins
Teacher/Student led
215 points
What you need:
Chromebook/Laptop/PC

JavaScript Switch Statements

This step-by-step lesson will guide you through understanding JavaScript Switch Statements. You'll learn about the 'switch' statement, the 'break' keyword, the 'default' keyword, and how to write your own 'switch' statement. You'll also explore how to handle multiple cases with the same code and include a 'default' case.
Learning Goals Learning Outcomes Teacher Notes

Live Class Feed

This is a live feed of the latest activity by your students on this lesson. It will update in real-time as they work on the lesson.
Load previous activity

    1 - What is a Switch Statement?

    The switch statement is used to pick or switch to a piece of code to run depending on a condition. We pass an expression into a switch statement and then choose a piece of code to run depending what condition matches it.

    In the following example the expression is the age variable and we have 3 conditions for 10 years old, 13 years old and 16 years old. We set the price depending on which condition equals the expression.

    
    switch(age){
        case 10:
            price = 5.99
            break
        case 13:
            price = 6.99
            break
        case 16:
            price = 7.99
            break
    }

    As you can see from the above example a switch statement is written like this:

    switch(expression){
        
    }

    And each condition we want to put a separate piece of code for is written like this:

    case condition1:
            // code for condition1 to run goes here
            break

    So putting it altogether it looks like this:

    switch(expression){
        case condition1:
            // code for condition1 to run goes here
            break
        case condition2:
            // code for condition2 to run goes here
            break
    }
    Note that JavaScript switch statements must be written in lowercase.
    switch is correct
    Switch is not correct
    SWITCH is not correct

    2 - The 'break' keyword

    When JavaScript code is running, the break keyword lets it know that it should "break out" of the switch statement.

    Look at the comments in this example that show the order that the lines of code are run. Notice how it 'breaks' out of the switch statement and then continues on.

    let age = 13            // this line will run 1st
    let price = 0           // this line will run 2nd
    let freeHat = false     // this line will run 3rd
    
    switch(age){            // this line will run 4th
        case 10:            // this line will run 5th (does not match)
            price = 5.99
            freeHat = true
            break
        case 13:            // this line will run 6th (matches)
            price = 6.99    // this line will run 7th
            freeHat = false // this line will run 8th
            break           // then this will run 9th (breaks out of the switch statement)
        case 16:
            price = 7.99
            freeHat = false
            break
    }
    
    basic.showNumber(price) // this line will run 10th

    3 - The 'default' keyword

    The default keyword can be used to specify some code to run if none of the case conditions are true.

    Look at the following example, notice how none of the case conditions are true so it runs the default code.

    let age = 18            // this line will run 1st
    let price = 0           // this line will run 2nd
    let freeHat = false     // this line will run 3rd
    
    switch(age){            // this line will run 4th
        case 10:            // this line will run 5th (does not match)
            price = 5.99
            freeHat = true
            break
        case 13:            // this line will run 6th (does not match)
            price = 6.99    
            freeHat = false 
            break           
        case 16:            // this line will run 7th (does not match)
            price = 7.99
            freeHat = false
            break
        default:            // this line will run 8th
            price = 9.99    // this line will run 9th
            freeHat = false // this line will run 10th
            break           // this line will run 11th (breaks out of the switch statement)
    }
    
    basic.showNumber(price) // this line will run 12th
    
    
    

    4 - Multiple cases, same code

    Sometimes we will want the same piece of code to run for different case conditions.

    Notice that in the following example we are saying that the same code should run for when age is 10 or 13.

    switch(age){
        case 10:
        case 13:
            price = 5.99
            freeHat = true
            break
        case 16:
            price = 7.99
            freeHat = false
            break
        default:
            price = 9.99
            freeHat = false
            break
    }

    5 - Write a 'switch' statement

    Now try write your own switch statement for the following scenario.

    We have the following 2 variables:

    1. age - that stores the persons age. 
    2. price - that stores the price of a ticket.
    let age = 12
    let price = 0

    What code would you need to write to set the price variable to:

    • 6.50 if the persons age is 12
    • and 7.50 if the persons age is 16

    Open this Microbit project that has the above code already added and click the 'Edit Code' button. Try write the switch statement to set the price depending on the age.

    see the code

    let age = 12
    let price = 0
    
    switch(age){
        case 12:
            price = 6.50
            break
        case 16:
            price = 7.50
            break
    }
    
    basic.showNumber(price)

    Unlock the Full Learning Experience

    Get ready to embark on an incredible learning journey! Get access to this lesson and hundreds more in our Digital Skills Curriculum.

    Copyright Notice
    This lesson is copyright of DigitalSkills.org. Unauthorised use, copying or distribution is not allowed.
    🍪 Our website uses cookies to make your browsing experience better. By using our website you agree to our use of cookies. Learn more