Altcademy - a Forbes magazine logo Best Coding Bootcamp 2023

What is Switch in JavaScript?

JavaScript is a powerful and versatile language, and one of the reasons for its popularity is its ability to handle complex logic and decision-making processes. In this blog post, we'll explore one such decision-making tool: the switch statement. The switch statement can be thought of as an alternative to a chain of if...else statements, and it's particularly useful when you have multiple conditions to evaluate.

Let's get started by looking at the basic syntax of a switch statement in JavaScript:

switch (expression) {
  case value1:
    // code to execute if expression matches value1
    break;
  case value2:
    // code to execute if expression matches value2
    break;
  // ...
  default:
    // code to execute if expression doesn't match any case value
}

The switch statement begins with the keyword switch followed by an expression in parentheses. This expression is evaluated, and its value is compared against each of the case values. If a match is found, the code block following that case is executed. The break statement at the end of each case block ensures that the code execution will exit the switch statement after a match has been found.

In case the expression value doesn't match any of the case values, the code block following the default keyword is executed. The default block is optional, but it's a good practice to include it to handle any unexpected input or edge cases.

To better understand how the switch statement works, let's use a simple example. Imagine we're building an application that displays different messages based on the day of the week. We could use a switch statement to handle this logic as follows:

let day = new Date().getDay(); // get the current day of the week (0-6)

switch (day) {
  case 0:
    console.log("It's Sunday! Take a break.");
    break;
  case 1:
    console.log("It's Monday! Back to work.");
    break;
  case 2:
    console.log("It's Tuesday! Keep going.");
    break;
  case 3:
    console.log("It's Wednesday! Halfway there.");
    break;
  case 4:
    console.log("It's Thursday! Almost done.");
    break;
  case 5:
    console.log("It's Friday! Weekend is coming.");
    break;
  case 6:
    console.log("It's Saturday! Enjoy your day off.");
    break;
  default:
    console.log("Invalid day value.");
}

In this example, we're using the Date object to get the current day of the week as a number between 0 and 6, where 0 represents Sunday, 1 represents Monday, and so on. The switch statement then compares the day value to each case, and displays an appropriate message for the corresponding day of the week.

Now, let's look at another example to gain a deeper understanding of the switch statement. Imagine you're building a calculator application, and you want to perform different calculations based on user input. You could use a switch statement to handle the different calculations as follows:

let num1 = 10;
let num2 = 5;
let operation = "add";

switch (operation) {
  case "add":
    console.log(num1 + num2);
    break;
  case "subtract":
    console.log(num1 - num2);
    break;
  case "multiply":
    console.log(num1 * num2);
    break;
  case "divide":
    console.log(num1 / num2);
    break;
  default:
    console.log("Invalid operation.");
}

In this example, we have two numbers num1 and num2, and an operation variable that represents the desired calculation. The switch statement evaluates the operation value and performs the corresponding calculation based on the matching case. If the operation is not one of the defined cases, the default code block is executed, displaying an "Invalid operation" message.

As you can see, the switch statement provides a clean and organized way to handle multiple conditions. However, it's important to note that the switch statement uses strict equality (===) when comparing the expression value to the case values. This means that the comparison will only return true if the values are of the same type and have the same value. For example:

let num = "5";

switch (num) {
  case 5:
    console.log("The number is 5.");
    break;
  default:
    console.log("The number is not 5.");
}

In this example, the output will be "The number is not 5", because the num variable is a string, and the case value is a number. Since the types are different, the comparison returns false.

In conclusion, the switch statement is a powerful tool for handling multiple conditions in a clean and organized manner. It's particularly useful when you have a large number of cases to evaluate, as it can make your code easier to read and maintain. However, it's important to be aware of the strict equality comparison used by the switch statement and ensure that your values are of the same type when necessary. With a solid understanding of the switch statement, you'll be well-equipped to tackle complex logic and decision-making in your JavaScript projects.