САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ
×

JS Учебник

JS Главная JS Введение JS Где установить? JS Вывод JS Заявления JS Синтаксис JS Комментарии JS Переменные JS Let JS Const JS Операторы JS Арифметика JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строк JS Поиск строк JS Шаблоны строк JS Числа JS Методы чисел JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Постоянный массив JS Даты JS Формат дат JS Методы получения дат JS Методы набора дат JS Объекты Math JS Случайные числа JS Булевы JS Сравнения JS Оператор If...Else JS Оператор Switch JS Цикл For JS Цикл For In JS Цикл For Of JS Цикл While JS Оператор Break JS Повторяющиеся JS Наборы JS Карты JS Typeof JS Преобразование JS Битовые JS Выражения JS Ошибки JS Область JS Подъемный JS Строгий JS Ключевое слово this JS Стрелки JS Классы JS JSON JS Отладчик JS Стиль JS Практика JS Ошибки JS Эффективность JS Слова

JS Версии

JS Версии JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE/Edge JS История

JS Объекты

Определение объекта Свойства объекта Методы объекта Отображение объекта Доступ объекта Конструкторы объекта Прототипы объекта Повторяющиеся объекты Набор объектов Карты объекта Справочник объектов

JS Функции

Определение функций Параметры функции Обращение к функции Вызов функции Применение функции Закрытие функции

JS Классы

Введение класса Наследование класса Статистический класс

JS Асинхронный

JS Обратный вызов JS Асинхронный JS Обещания JS Асинхронный

JS HTML DOM

DOM Введение DOM Методы DOM Документы DOM Элементы DOM HTML DOM Формы DOM CSS DOM Анимация DOM События DOM Прослушиватель DOM Навигация DOM Узлы DOM Коллекция DOM Список узлов

JS Браузер BOM

JS Window JS Экран JS Расположение JS История JS Навигатор JS Предупреждение JS Синхронизация JS Куки

JS Веб APIы

Веб API Введение Веб API История Веб API Хранилище Веб API Работник Веб API Извлечь Веб API Геолокации

JS AJAX

AJAX Введение AJAX XMLHttp AJAX Запрос на сервер AJAX Ответ с сервера AJAX Файл XML AJAX Файл PHP AJAX Файл ASP AJAX База данных AJAX Приложения AJAX Примеры

JS JSON

JSON Введение JSON Синтаксис JSON или XML JSON Типы данных JSON Парсинг JSON Строки JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS или jQuery

jQuery Селекторы jQuery Элементы jQuery CSS jQuery DOM

JS Примеры

JS Примеры JS HTML DOM JS HTML Ввод JS HTML Объекты JS HTML События JS Браузер JS Редактор JS Упражнения JS Викторина JS Сертификат

JS Справочник

JavaScript Объекты HTML DOM Объекты


JavaScript Оператор switch



Оператор switch используется для выполнения различных действий, основанных на различных условиях.


JavaScript Оператор Switch

Используйте оператор switch, чтобы выбрать один из множества блоков кода для выполнения.

Синтаксис

switch(expression) {
  case x:
    // блок кода
    break;
  case y:
    // блок кода
    break;
  default:
    // блок кода
}

Вот как это работает:

  • Выражение switch (переключателя) вычисляется один раз.
  • Значение выражения сравнивается со значениями каждого случая.
  • Если есть совпадение, соответствующий блок кода выполняется.
  • Если совпадений нет, выполняется блок кода по умолчанию

Пример

Метод getDay() возвращает день недели как число между 0 и 6.

(Воскресенье=0, Понедельник=1, Вторник=2 ..)

В этом примере номер дня недели используется для вычисления названия дней недели:

switch (new Date().getDay()) {
  case 0:
    day = "Воскресенье";
    break;
  case 1:
    day = "Понедельник";
    break;
  case 2:
     day = "Вторник";
    break;
  case 3:
    day = "Среда";
    break;
  case 4:
    day = "Четверг";
    break;
  case 5:
    day = "Пятница";
    break;
  case 6:
    day = "Суббота";
}

Результатом будет:

Попробуйте сами »


Ключевое слово break

Когда JavaScript достигает ключевого слова break, он выходит из блока switch.

Это остановит выполнение внутри блока.

Нет необходимости обрывать последний кейс в блоке switch. Блок всё равно обрывается (заканчивается).

Примечание: Если вы пропустите оператор break, следующий кейс будет выполнен, даже если оценка не соответствует кейсу.


Ключевое слово default

Ключевое слово default указывает код для запуска, если нет ни одного совпадения:

Пример

Метод getDay() возвращает день недели в виде числа от 0 до 6.

Если сегодня не Суббота (6) и не Воскресенье (0), напишите сообщение по умолчанию (default):

switch (new Date().getDay()) {
  case 6:
    text = "Сегодня суббота";
    break;
  case 0:
    text = "Сегодня воскресенье";
    break;
  default:
    text = "С нетерпением жду выходных";
}

Результатом текста будет:

Попробуйте сами »

Случай default не должен быть последним случаем в блоке switch:

Пример

switch (new Date().getDay()) {
  default:
    text = "С нетерпением жду выходных";
    break;
  case 6:
    text = "Сегодня суббота";
    break;
  case 0:
    text = "Сегодня воскресенье";
}
Попробуйте сами »

Если default не является последним кейсом в блоке switch, не забудьте завершить кейс default с помощью break.


Общие блоки кода

Иногда необходимо, чтобы разные варианты переключения (кейсы switch) использовали один и тот же код.

В этом примере 4 и 5 используют один и тот же блок кода, а 0 и 6 - другой блок кода:

Пример

switch (new Date().getDay()) {
  case 4:
  case 5:
    text = "Скоро выходные";
    break;
  case 0:
  case 6:
    text = "Сейчас выходные";
    break;
  default:
    text = "С нетерпением жду выходных";
}
Попробуйте сами »

Детали переключения

Если нескольким кейсам соответствует значение кейса, выбирается первый кейс.

Если подходящих кейсов не найдено, программа переходит на ярлык default.

Если метка по умолчанию не найдена, программа переходит к оператору(ам) после switch.


Строгое сравнение

Switch кейсы используют строгое сравнение (===).

Значения должны быть одного типа, чтобы соответствовать.

Строгое сравнение может быть true, только если операнды имеют одинаковый тип.

В этом примере не будет совпадения для х:

Пример

var x = "0";
switch (x) {
  case 0:
    text = "Выкл";
    break;
  case 1:
    text = "Вкл";
    break;
  default:
    text = "Значение не найдено";
}
Попробуйте сами »

Проверьте себя с помощью упражнений

Упражнение:

Создайте switch заявление, которая будет предупреждать "Привет", если fruits это "Банан", и "Добро пожаловать", если fruits это "Яблоко".

(fruits) {
 "Банан":
alert("Привет")
break;
 "Яблоко":
alert("Добро пожаловать")
break;    
}

Упражнение