Поиск по сайту:

Как использовать оператор Switch в JavaScript

Введение

Условные операторы являются одними из самых полезных и общих функций всех языков программирования. Как писать условные операторы в JavaScript описывает, как использовать ключевые слова if, else и else if для управления потоком программы на основе различные условия, которые в JavaScript часто являются результатом пользовательского ввода.

В дополнение к if...else в JavaScript есть функция, известная как оператор switch. switch — это тип условного оператора, который оценивает выражение по нескольким возможным случаям и выполняет один или несколько блоков кода на основе соответствующих случаев. Оператор switch тесно связан с условным оператором, содержащим множество блоков else if, и их часто можно использовать взаимозаменяемо.

В этом руководстве мы узнаем, как использовать оператор switch, а также как использовать связанные ключевые слова case, break и <по умолчанию. Наконец, мы рассмотрим, как использовать несколько вариантов в операторе switch.

Выключатель

Оператор switch оценивает выражение и выполняет код в результате совпадения case. Основной синтаксис аналогичен оператору 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.
  • Если оно не совпадает, x будет пропущено, а случай y будет проверен на соответствие выражению. Если y соответствует выражению, код выполнится и выйдет из блока switch.
  • Если ни один из случаев не совпадает, будет запущен блок кода default.

Давайте создадим рабочий пример оператора switch, следуя приведенному выше синтаксису. В этом блоке кода мы найдем текущий день недели с помощью метода new Date() и getDay() для вывода числа, соответствующего текущему дню. 0 означает воскресенье, вплоть до 6, что означает субботу. Начнем с настройки нашей переменной.

const day = new Date().getDay();

Используя switch, мы будем отправлять сообщение на консоль каждый день недели. Программа будет выполняться в порядке сверху вниз в поисках соответствия, и как только оно будет найдено, команда break остановит блок switch от продолжения оценки операторов.

// Set the current day of the week to a variable, with 0 being Sunday and 6 being Saturday
const day = new Date().getDay();

switch (day) {
	case 0:
		console.log("It's Sunday, time to relax!");
		break;
	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;
	default:
		console.log("Something went horribly wrong...");
}

Output
'Just one more day 'til the weekend!'

Этот код тестировался в четверг, что соответствует 4, поэтому вывод консоли был Еще один день до выходных!. В зависимости от того, в какой день недели вы тестируете код, результат будет отличаться. В конце мы добавили блок default для запуска в случае ошибки, чего в данном случае быть не должно, так как в неделе всего 7 дней. Мы также могли бы, например, распечатать результаты только с понедельника по пятницу, а блок default мог бы иметь такое же сообщение для выходных.

Если бы мы опустили ключевое слово break в каждом операторе, ни один из других операторов case не был бы оценен как истина, но программа продолжила бы проверку, пока не достигла бы конца. . Чтобы сделать наши программы быстрее и эффективнее, мы включаем break.

Диапазоны переключения

Может возникнуть ситуация, когда вам потребуется оценить диапазон значений в блоке switch, а не одно значение, как в нашем примере выше. Мы можем сделать это, установив для нашего выражения значение true и выполнив операцию внутри каждого оператора case.

Чтобы упростить понимание, воспользуемся знакомым примером. В учебнике по условным утверждениям мы создали приложение для оценивания, которое будет принимать числовой балл и преобразовывать его в буквенную оценку со следующими требованиями.

  • Оценка 90 и выше – это пятерка.
  • Оценка от 80 до 89 соответствует B
  • Оценка от 70 до 79 — тройка.
  • Оценка от 60 до 69 соответствует D.
  • Оценка 59 или ниже соответствует F

Теперь мы можем записать это как оператор switch. Поскольку мы проверяем диапазон, мы будем выполнять операцию в каждом case, чтобы проверить, оценивается ли каждое выражение как true, а затем выйти из инструкции, как только требования для true были удовлетворены.

// 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");
}

Output
'B'

Выражение в круглых скобках, которое необходимо оценить, в этом примере равно true. Это означает, что любой case, который оценивается как true, будет совпадением.

Как и в случае с else if, switch оценивается сверху вниз, и первое верное совпадение будет принято. Следовательно, несмотря на то, что наша переменная grade имеет значение 87 и, следовательно, оценивается как true также для C и D, первое совпадение — B, что быть выходом.

Несколько случаев

Вы можете столкнуться с кодом, в котором несколько случаев должны иметь одинаковый вывод. Для этого вы можете использовать более одного case для каждого блока кода.

Чтобы проверить это, мы собираемся сделать небольшое приложение, сопоставляющее текущий месяц с соответствующим сезоном. Во-первых, мы будем использовать метод new Date(), чтобы найти число, соответствующее текущему месяцу, и применить его к переменной month.

const month = new Date().getMonth();

Метод new Date().getMonth() выводит число от 0 до 11, где 0 Январь, а 11 — декабрь. На момент публикации это сентябрь, что будет соответствовать 8.

Наше приложение будет выводить четыре времени года со следующими характеристиками для простоты:

  • Зима: январь, февраль и март.
  • Весна: апрель, май и июнь.
  • Лето: июль, август и сентябрь.
  • Осень: октябрь, ноябрь и декабрь.

Ниже наш код.


// 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.");
}

Когда мы запустим код, мы получим выходные данные, идентифицирующие текущий сезон на основе приведенных выше спецификаций.

Output
Summer

Текущий месяц на момент публикации был 8, что соответствовало одному из утверждений case с выводом сезона Summer.

Заключение

В этой статье мы рассмотрели оператор switch, тип условного оператора, который оценивает выражение и выводит разные значения на основе результатов сопоставления. Мы рассмотрели операторы switch с использованием диапазона и нескольких операторов case.

Чтобы узнать больше о switch, вы можете просмотреть его в Mozilla Developer Network.