else if
statements are a great tool if we need to check multiple conditions. In programming, we often find ourselves needing to check multiple values and handling each of them differently. For example:
let groceryItem = 'papaya'; if (groceryItem === 'tomato') { console.log('Tomatoes are $0.49'); } else if (groceryItem === 'papaya'){ console.log('Papayas are $1.29'); } else { console.log('Invalid item'); }
In the code above, we have a series of conditions checking for a value that matches a groceryItem
variable. Our code works fine, but imagine if we needed to check 100 different values! Having to write that many else if
statements sounds like a pain!
A switch
statement provides an alternative syntax that is easier to read and write. A switch
statement looks like this:
let groceryItem = 'papaya'; switch (groceryItem) { case 'tomato': console.log('Tomatoes are $0.49'); break; case 'lime': console.log('Limes are $1.49'); break; case 'papaya': console.log('Papayas are $1.29'); break; default: console.log('Invalid item'); break; } // Prints 'Papayas are $1.29'
- The
switch
keyword initiates the statement and is followed by( ... )
, which contains the value that eachcase
will compare. In the example, the value or expression of theswitch
statement isgroceryItem
. - Inside the block,
{ ... }
, there are multiplecase
s. Thecase
keyword checks if the expression matches the specified value that comes after it. The value following the firstcase
is'tomato'
. If the value ofgroceryItem
equalled'tomato'
, thatcase
‘sconsole.log()
would run. - The value of
groceryItem
is'papaya'
, so the thirdcase
runs—Papayas are $1.29
is logged to the console. - The
break
keyword tells the computer to exit the block and not execute any more code or check any other cases inside the code block. Note: Withoutbreak
keywords, the first matching case will run, but so will every subsequent case regardless of whether or not it matches—including the default. This behavior is different fromif
/else
conditional statements that execute only one block of code. - At the end of each
switch
statement, there is adefault
statement. If none of thecase
s are true, then the code in thedefault
statement will run.
Instructions
Let’s write a switch
statement to decide what medal to award an athlete.
athleteFinalPosition
is already defined at the top of main.js. So start by writing a switch
statement with athleteFinalPosition
as its expression.
Inside the switch
statement, add three case
s:
- The first
case
checks for the value'first place'
- If the expression’s value matches the value of the
case
thenconsole.log()
the string'You get the gold medal!'
- If the expression’s value matches the value of the
- The second
case
checks for the value'second place'
- If the expression’s value matches the value of the
case
thenconsole.log()
the string'You get the silver medal!'
- If the expression’s value matches the value of the
- The third
case
checks for the value'third place'
- If the expression’s value matches the value of the
case
thenconsole.log()
the string'You get the bronze medal!'
- If the expression’s value matches the value of the
Remember to add a break
after each console.log()
.
Now, add a default
statement at the end of the switch
that uses console.log()
to print 'No medal awarded.'
.
If athleteFinalPosition
does not equal any value of our case
s, then the string 'No medal awarded.'
is logged to the console.
Remember to add the break
keyword at the end of the default
case.