JavaScript Switch Statement
The switch statement is used to perform different actions based on different conditions.
The JavaScript Switch Statement
Use the switch statement to select one of many code blocks to be executed.
Syntax
This is how it works:
- The switch expression is evaluated once.
- The value of the expression is compared with the values of each case.
- If there is a match, the associated block of code is executed.
- If there is no match, the default code block is executed.
Example
The getDay() method returns the weekday as a number between 0 and 6.
(Sunday=0, Monday=1, Tuesday=2 ..)
This example uses the weekday number to calculate the weekday name:
The result of day will be:
The break Keyword
When JavaScript reaches a break keyword, it breaks out of the switch block.
This will stop the execution inside the switch block.
It is not necessary to break the last case in a switch block. The block breaks (ends) there anyway.
Note: If you omit the break statement, the next case will be executed even if the evaluation does not match the case.
The default Keyword
The default keyword specifies the code to run if there is no case match:
Example
The getDay() method returns the weekday as a number between 0 and 6.
If today is neither Saturday (6) nor Sunday (0), write a default message:
The result of text will be:
The default case does not have to be the last case in a switch block:
Example
If default is not the last case in the switch block, remember to end the default case with a break.
Common Code Blocks
Sometimes you will want different switch cases to use the same code.
In this example case 4 and 5 share the same code block, and 0 and 6 share another code block:
Example
Switching Details
If multiple cases matches a case value, the first case is selected.
If no matching cases are found, the program continues to the default label.
If no default label is found, the program continues to the statement(s) after the switch.
Strict Comparison
Switch cases use strict comparison (===).
The values must be of the same type to match.
A strict comparison can only be true if the operands are of the same type.
Конструкция Switch — Основы JavaScript
Многие языки в дополнение к условной конструкции if включают в себя switch. Это специализированная версия if, созданная для некоторых особых ситуаций. Например, ее имеет смысл использовать там, где есть цепочка if else с проверками на равенство. Например:
Эта составная проверка обладает одной отличительной чертой: каждая ветка здесь — это проверка значения переменной status . Switch позволяет записать этот код короче и выразительнее:
Свитч — довольно сложная конструкция с точки зрения количества элементов, из которых она состоит:
- Внешнее описание, в которое входит ключевое слово switch . Переменная, по значениям которой switch будет выбирать поведение. И фигурные скобки для вариантов выбора.
- Конструкции case и default , внутри которых описывается поведение для разных значений рассматриваемой переменной. Каждый case соответствует if в примере выше. default – это особая ситуация, соответствующая ветке else в условных конструкциях. Как else , указывать default не обязательно (но линтер всегда его просит).
- break нужен для предотвращения «проваливания». Если его не указать, то после выполнения нужного case выполнение перейдет к следующему case , и так либо до ближайшего break , либо до конца switch.
Фигурные скобки в switch не определяют блок кода, как это было в других местах. Внутри допустим только тот синтаксис, который показан выше. То есть там можно использовать case или default . А вот внутри каждого case (и default ) ситуация другая. Здесь можно выполнять любой произвольный код:
Иногда результат, полученный внутри case , — это конец выполнения функции, содержащей switch. В таком случае его нужно как-то вернуть наружу. Для решения этой задачи есть два способа.
Первый. Создать переменную перед switch, заполнить ее в case и затем, в конце, вернуть значение этой переменной наружу.
Второй способ проще и короче. Вместо создания переменной, case позволяет внутри себя делать обычный возврат из функции. А так как после return никакой код не выполняется, то мы можем избавиться от break :
Switch хоть и встречается в коде, но технически всегда можно обойтись без него. Ключевая польза при его использовании в том, что он лучше выражает намерение программиста, когда нужно проверять конкретные значения переменной. Хотя кода и стало физически чуть больше, читать его легче, в отличие от блоков else if.
Оператор switch в JS
Оператор switch используется для принятия решений. Он оценивает выражение и выполняет нужный блок кода, соответсвующий результату выражения.
Синтаксис
Как это работает
Оператор switch оценивает значение переменной/выражения .
- Если результат выражения равен значению1 , выполняется тело case 1 .
- Если результат выражения равен значению2 , выполняется тело case 2 .
- Если результат выражения не подходит ни под одно значение N , выполняется тело default .
Примечание 1. Оператор break завершает работу оператора switch. Но break можно не использовать, тогда после выполнения блока, соответсвующего текущему значению выражения, выполнятся все остальные блоки.
Примечание 2. Блок default тоже необязательный. Его можно не использовать.
Блок-схема
Пример 1. Используем оператор switch
Вывод
Оператор switch оценивает значение переменной a .
- Сначала оператор switch проверяет, не равно ли значение a значению1 — 11. Поскольку a ≠ 11, оператор switch переходит к следующему case.
- Оператор switch проверяет, не равно ли значение a значению2 — 12. Поскольку a = 12, мы заходим в блок case 12 .
- Оператор break завершает работу switch, и поток управления возвращается из оператора switch.
Пример 2. Проверяем тип с помощью оператора switch
Вывод
Сначала оператор оценивает значение переменной a.
- В JavaScript оператор switch строго проверяет значение. Поэтому значение a = 11 не совпадает со значением1 — «11» .
- Затем оператор switch переходит ко второму случаю. Здесь результат выражения a = 11 совпадает со значением2 — 11 .
- Оператор break завершает работу switch, и поток управления возвращает из оператора switch.
Примечание. В JavaScript оператор switch строго проверяет случаи с результатом выражения. Это значит, что значение в case и результат выражения должны быть одного типа. Обратите внимание, что в приведенном выше примере 11 не совпадает с «11».
Пример 3. Простой калькулятор с помощью оператора switch
Вывод
В приведенной выше программе пользователю предлагается ввести оператор +, -, * или /, а также два операнда. Затем с помощью оператора switch выполняются соответсвующие оператору вычисления.
Группировка case в операторе switch
В операторе switch случаи можно сгруппировать.
Пример 4. Используем switch с несколькими case
Вывод
В приведенной выше программе несколько случаев сгруппированы. Ко всем сугрппированным case относится один и тот же блок кода.
То есть если fruit равно «яблоко», «манго» или «ананас», на экран в любом случае выведется сообщение о том, что это фрукт.
Оператор switch в Javascript
Условные операторы – одна из наиболее часто используемых и полезных функций всех языков программирования.
Любой разработчик должен уметь использовать операторы if, else и else if для управления потоком программы на основе разных условий, которые в JavaScript часто являются результатом пользовательского ввода.
Кроме if…else, в JavaScript есть также оператор switch. switch – это условный оператор, который сравнивает выражение сразу с несколькими возможными вариантами и выполнять один или несколько блоков кода на основе обнаруженных соответствий. Оператор switch по сути может заменить несколько блоков else if.
Данный мануал научит вас пользоваться оператором switch и ключевыми словами case, break и default. Также вы узнаете, как использовать в коде несколько операторов switch.
Оператор switch
Оператор switch определяет, отвечает ли выражение тем или иным условиям, и выполняет код, если это так. Сначала этот оператор кажется очень запутанным и сложным, но основной его синтаксис аналогичен синтаксису оператора if. Он всегда записывается как switch () <>. В круглых скобках находится выражение, которое нужно оценить, а в фигурных скобках содержится код для выполнения.
Ниже представлен пример использования оператора switch с двумя операциями case и блоком default:
switch (expression) <
case x:
// execute case x code block
break;
case y:
// execute case y code block
break;
default:
// execute default code block
>
В этом коде события будут происходить в такой последовательности:
- Сначала оценивается выражение.
- Оно сравнивается с первым условием (case x). В случае если выражение отвечает условию, оператор выполнит соответствующий код и оператор break прекратит выполнение блока switch.
- Если выражение не отвечает первому условию, оператор сравнит его с условием у. В случае если выражение отвечает условию у, оператор выполнит соответствующий код, а break прекратит выполнение блока switch.
- Если выражение не отвечает ни одному из условий, перечисленных в блоке switch, выполняется блок default.
Попробуйте написать простой блок с оператором switch. К примеру, метод new Date() будет определять текущий день недели, а метод getDay() будет выводить номер этого дня в неделе: 1 отвечает понедельнику, 7 – воскресенью. Создайте файл week.js и определите в нем переменную:
const day = new Date().getDay();
Оператор switch может выводить в консоль сообщения каждый день. Программа будет выполняться по порядку сверху вниз, ища совпадения. Как только совпадение будет обнаружено, команда break остановит блок switch.
// Set the current day of the week to a variable, with 1 being Monday and 7 being Sunday
const day = new Date().getDay();
switch (day) <
case 1:
console.log(«Happy Monday!»);
break;
case 2:
console.log(«It’s Tuesday. You got this!»);
break;
case 3:
console.log(«Hump day already!»);
break;
case 4:
console.log(«Just one more day ’til the weekend!»);
break;
case 5:
console.log(«Happy Friday!»);
break;
case 6:
console.log(«Have a wonderful Saturday!»);
break;
case 7:
console.log(«It’s Sunday, time to relax!»);
break;
default:
console.log(«Something went horribly wrong. «);
>
‘Just one more day ’til the weekend!’
Этот код был запущен в четверг, что соответствует числу 4, поэтому в консоли появилось сообщение «Just one more day ’til the weekend!». Результат будет отличаться в зависимости от того, в какой день недели вы запускаете программу. Блок default в конце программы запустится в случае ошибки, которая в этом случае не должна случиться, поскольку в неделе только 7 дней. Также программа могла бы выводить результаты с понедельника по пятницу, а блок default мог срабатывать в выходные.
Если бы мы пропустили ключевое слово break в каждом из операторов, ни один из других операторов case не мог бы быть оценен как true, но программа продолжила бы проверять условия до конца. Чтобы программы были быстрее и эффективнее, нужно использовать break.
Обработка диапазонов с помощью switch
В предыдущем примере вы узнали, как обработать одно значение с помощью switch . Но иногда в блоке switch возникает необходимость оценить диапазон значений.
Для этого нужно оценить каждое вычисляемое выражение как истинное и выполнить операцию во всех выражениях case.
Чтобы в этом было проще разобраться, используем уже знакомый пример. Эту программу мы рассматривали в мануале по условным выражениям. Это простое приложение обрабатывает количество баллов, полученных за тест, и выставляет финальную оценку, где:
- 90 и выше – А.
- 80-89 – В.
- 70-79 – С.
- 60-69 – D.
- 59 и ниже – F.
Теперь можно написать эту программу с помощью оператора switch. Чтобы проверить диапазон, нужно выполнить каждую операцию case и проверить, оцениваются ли выражения как true; когда такое выражение найдено, блок switch прекратит работу.
// Set the student’s grade
const grade = 87;
switch (true) <
// If score is 90 or greater
case grade >= 90:
console.log(«A»);
break;
// If score is 80 or greater
case grade >= 80:
console.log(«B»);
break;
// If score is 70 or greater
case grade >= 70:
console.log(«C»);
break;
// If score is 60 or greater
case grade >= 60:
console.log(«D»);
break;
// Anything 59 or below is failing
default:
console.log(«F»);
>
‘B’
Выражение в круглых скобках истинно в этом примере. Это означает, что любой случай case, который оценивается как true, будет соответствовать условию.
Точно так же, как и else if, блок switch оценивается сверху вниз, и выполняется первое соответствие, которое оценивается как истинное. Несмотря на то, что значение переменной 87 также входит в диапазон оценок C и D, программа находит первое совпадение – В – и выводит его.
Обработка нескольких case
Вы можете столкнуться с кодом, в котором несколько случаев должны иметь одинаковый вывод. Для этого можно использовать более одного случая в каждом блоке кода.
Чтобы посмотреть, как это работает, напишите небольшое приложение, которое определяет, к какому времени года относится текущий месяц. Используйте новый метод Date (), чтобы узнать число, соответствующее текущему месяцу, и применить его к переменной month. Создайте файл seasons.js и вставьте в него такой код:
const month = new Date().getMonth();
Метод new Date().getMonth() выводит число от 0 до 11, где 0 – январь, а 11 – декабрь. Мануал написан в сентябре, которому соответствует число 8.
Приложение будет выводить времена года:
- Winter: для January, February и March
- Spring: для April, May и June.
- Summer: July, August и September.
- Autumn: для October, November и December.
Ниже представлен полный код приложения.
// Get number corresponding to the current month, with 0 being January and 11 being December
const month = new Date().getMonth();
switch (month) <
// January, February, March
case 0:
case 1:
case 2:
console.log(«Winter»);
break;
// April, May, June
case 3:
case 4:
case 5:
console.log(«Spring»);
break;
// July, August, September
case 6:
case 7:
case 8:
console.log(«Summer»);
break;
// October, November, December
case 9:
case 10:
case 11:
console.log(«Autumn»);
break;
default:
console.log(«Something went wrong.»);
>
После запуска приложение выведет время года, исходя из указанных выше спецификаций.
Поскольку сейчас месяц 8, который отвечает одному из выражений case, программа выводит значение Summer.
Заключение
Теперь вы знаете, как работает оператор switch, который оценивает выражение и выводит разные значения на основе результатов сопоставления. Оператор switch можно использовать для обработки диапазонов и нескольких выражений case.