CS133JS Beginning Programming: JavaScript

Selection Using switch case statements

Table of Contents

Introduction

Q and A

• How is last week's lab assignment (lab 2) going?

  • Code reviews were due Tuesday. You can still do them. Any questions about those?

  • The production version is due Thursday.

• Does anyone have any general questions about anything?

Review

Selection Using the Ternary Operator, ?

A ternary expression evaluates to a value.

let speed = Number(prompt("How fast are you going?"));
let warning = speed <= 55 ? "Doing the speed limit" : "Going too fast";
console.log(warning);

Selection Using if Statements

An if statement determines which branch of code will be executed.
Parts of an if statement:

xxxxxxxxxx
 if(degrees < 45)        // keyword and condition
  alert("wear a coat");  // statement to be executed if the *condition* is true

Types of if statements

• Single branch

  xxxxxxxxxx
  if(degrees < 45) 
    alert("wear a coat"); 
  

• Multiple branches

  xxxxxxxxxx
  if(degrees < 32)   
    alert("wear a warm coat");
  else if (degrees < 45)
    alert("wear a jacket");
  else
    alert("enjoy the warm weather! ");
  

• Nested

  xxxxxxxxxx
  if(degrees < 60) 
    if(wind > 10)
      alert("wear a jacket");
  

Braces (optional, but recommended, unless there is more than one statement to execute, then they are required.)

xxxxxxxxxx
// convert fractions in the form 1/x to decimals
let quotient = 0; divisor = 0;
divisor = prompt("To calculate 1/x, enter x");
if (divisor > 0)
{
   quotient = 1 / parseInt(divisor);
   alert("decimal value: " + quotient);
}
else
{
   alert("Please enter a number greater than zero");
}

Exercise

There are three prices for a book titled The Joy of JavaScript:

• $34.99 for the hardback.

• $24.99 for the paperback.

• $14.99 for the e-book, or free for students.

Write the code and run it in the console where you can simply assign values to variables for input.

Selection using switch case statements

• The third type of selection control structure we are learning in this course is switch.

• Can always be replaced with a multi-branching if, else if, else statement.

• But, a switch can’t do everything that an if, else if, else statement can.

  • Can only be used to test for equality, not > or <

  • Can only operate on a single variable.

Parts of a switch statement

This code snippet gives a response to the question: "What is a common color for a mouse?".

xxxxxxxxxx
let color = prompt("What is a common color for a mouse?");
let response = "";
switch (color)               // keyword switch and variable used by cases
{ 
    case "grey":             // keyword case and condition
        response = "Yes! ";  // statement to execute
        break;               // marks the end of the case
    case "gray": 
        response = "Yes!"; 
        break;
    case "brown": 
        response = "OK, sometimes"; 
        break;
    case "white": 
        response = "Just for lab mice"; 
        break;
    default:                   // like an else
        response = "I don’t think so";   
        // no break needed
}

Multiple cases can be used to execute one statement

In this example, the same response is given for "grey" and "gray" as well as "brown" and "white".

​x
 let color = prompt("What is a common color for a mouse?");
 let response = "";

 switch (color) 
 { 
   case "grey": 
   case "gray": 
     response = "Yes!"; 
     break;
   case "brown": 
   case "white": 
     response = "OK, sometimes";
     break;
   default: 
     response = "I don’t think so"; 
 }

Multiple statements can be executed in each case

In this example two variables are set to values instead of just one variable.

xxxxxxxxxx
 let color = prompt("What is a common color for a mouse?");
 let response = "";   // comment on answer
 let score = 0; // socre for answer

 switch (color) 
 { 
   case "grey": 
   case "gray": 
     response = "Yes!"; 
     score = 10;
     break;
   case "brown": 
   case "white": 
     response = "OK, sometimes";
     score = 5;
     break;
   default: 
     score = 0;
     response = "I don’t think so"; 
 }

Best Practices

• Only one return from a function
  When you use a switch statement inside a function, you should only have one return statement in the function, don't return from inside a case.

• If you are only comparing for equality, use a switch instead of if, else if, else statements.

Exercise

Write code in the console to determine the price of The Joy of JavaScript using a switch statement instead of a multi-branching if else statement.

Reference

W3Schools

Switch Statement

Beginning JavaScript Lecture Notes by Brian Bird, 2018, revised 2025 are licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.