Урок 26. Ключевое слово switch в JavaScript

Все уроки по JavaScript расположены здесь.

Операторы if-else в js отлично работают тогда, когда нам надо проверить одно-два условия. В программировании нам часто приходится проверять несколько значений и обрабатывать каждое из них по-разному. Например:

let groceryItem = 'papaya';

if (groceryItem === 'tomato') {
  console.log('Tomatoes are $0.49');
} else if (groceryItem === 'papaya'){
  console.log('Papayas are $1.29');
} else {
  console.log('Invalid item');
}

В приведенном выше коде у нас есть ряд условий, проверяющих значение, соответствующее переменной groceryItem. Наш код работает нормально, но представьте, что нам нужно проверить 100 различных значений!

Оператор switch предоставляет альтернативный синтаксис, упрощающий это. Выглядит он следующим образом:

let groceryItem = 'papaya';

switch (groceryItem) {
  case 'tomato':
    console.log('Tomatoes are $0.49');
    break;
  case 'lime':
    console.log('Limes are $1.49');
    break;
  case 'papaya':
    console.log('Papayas are $1.29');
    break;
  default:
    console.log('Invalid item');
    break;
}

// Prints 'Papayas are $1.29'

Ключевое слово switch инициирует оператор и сопровождается ( ... ), который содержит значение, которое будет сравниваться в каждом случае. В этом примере значением или выражением оператора switch является groceryItem.

Внутри { ... }, есть несколько случаев. Ключевое слово case проверяет, соответствует ли выражение указанному после него значению. Значение после первого случая - "tomato". Если значение groceryItem 'tomato', console.log('Tomatoes are $0.49'); будет работать.

Значение groceryItem является "papaya", поэтому третий случай работает — папайя $1.29 выводится в консоли.

Ключевое слово break указывает компьютеру выйти из блока и больше не выполнять код и не проверять другие случаи внутри блока кода. Примечание: без ключевого слова Break в конце каждого случае программа будет выполнять код для всех подходящих случаев и код по умолчанию. Это поведение отличается от условных операторов if/else, которые выполняют только один блок кода.

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

Упражнения к уроку

Есть код:

let athleteFinalPosition = 'first place';

Вам необходимо решить, какой медалью наградить спортсмена. Начните с написания оператора switch с athleteFinalPosition в качестве выражения.

Внутри оператора switch добавьте три случая:
- В первом случае проверяется значение 'first place'. Если значение выражения совпадает со значением, то выведите на консоль строку 'вы получаете золотую медаль!".
- Во втором случае проверяется значение " second place". Если значение выражения совпадает со значением, то выведите на консоль строку 'вы получаете серебряную медаль!".
- В третьем случае проверяется значение "third place". Если значение выражения совпадает со значением, то выведите на консоль строку 'вы получаете бронзовую медаль!".
Не забудьте добавить break.

Теперь добавьте оператор по умолчанию в конце switch, который использует console.log() для печати 'No medal awarded'. Если значение athleteFinalPosition не равно ничему, то это и должно выводиться. Не забудьте добавить ключевое слово break.

Автор этого материала - я - Пахолков Юрий. Я оказываю услуги по написанию программ на языках Java, C++, C# (а также консультирую по ним) и созданию сайтов. Работаю с сайтами на CMS OpenCart, WordPress, ModX и самописными. Кроме этого, работаю напрямую с JavaScript, PHP, CSS, HTML - то есть могу доработать ваш сайт или помочь с веб-программированием. Пишите сюда.

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

Программирование up

Мои услуги