У цій короткій статті я познайомлю вас із випадками перемикання JavaScript та їх використанням на практичних прикладах.
Ця стаття допоможе краще пояснити практичні приклади, які допоможуть вам глибше зрозуміти випадки перемикань.
Передумови.
- Базові знання JavaScript
- Редактор коду
- Веб-браузер
- Ваш мозок :)
switch
Заява може в принципі замінити кілька if
перевірок в JavaScript.
Це дає більш описовий спосіб порівняння значення з кількома варіантами.
Синтаксис комутатора
switch
Має один або кілька case
блоків , і додатковий корпус по замовчуванням.
switch(x) { case 'value1': // if (x === 'value1') //code here [break] case 'value2': // if (x === 'value2') //code here [break] default: //code here [break] }
- Значення
x
перевіряється на точну рівність значенню від першогоcase
(тобтоvalue1
), потім до другого (value2
) тощо. - Якщо рівність знайдено,
switch
починає виконувати код, починаючи з відповідногоcase
, до найближчогоbreak
(або до кінцяswitch
). - Якщо жоден регістр не збігається,
default
код виконується (якщо він існує).
Кілька реальних прикладів
- Простий перемикач відтворення та паузи
Оператор switch
можна використовувати для декількох гілок на основі числа або рядка:
switch (movie) { case 'play': playMovie(); break; case 'pause': pauseMovie(); break; default: doNothing(); }
Якщо ви не додасте break
заяву, виконання "провалиться" на наступний рівень. Важливо, щоб ви навмисно позначили падіння коментарем, якщо ви справді мали на увазі, що це допомагає налагодженню:
switch (movie) { case 'play': // fallthrough case 'pause': pauseMovie(); break; default: doNothing(); }
Речення за замовчуванням є необов’язковим. Ви можете мати вирази як у комутаційній частині, так і у випадках, якщо хочете; порівняння відбуваються між ними за допомогою ===
оператора:
switch (3 + 7) { case 5 + 5: correct(); break; default: neverhappens(); }
- Проста математика Calc Switch
let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); break; case 8: alert( 'Exactly!' ); break; case 10: alert( 'Too large' ); break; default: alert( "Incorrect values!" ); }
Тут switch
починається порівняння average
з першого case
варіанту, який є 4
. Матч не вдається.
Тоді 8
. Це збіг, тому виконання починається з case 8
найближчого break
.
Якщо немає, break
то виконання продовжується з наступним case
без жодних перевірок.
Ось приклад без break
:
let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); case 8: alert( 'Exactly!' ); case 10: alert( 'Too big' ); default: alert( "Incorrect values!" ); }
У наведеному вище прикладі ми побачимо послідовне виконання трьох alerts
:
alert( 'Exactly!' ); alert( 'Too big' ); alert( "Incorrect values!" );
- getDay () метод перемикача
getDay()
Метод повертає день тижня як число між 0 і 6.
У цьому прикладі для розрахунку назви тижня використовується номер тижня:
switch (new Date().getDay()) { case 0: day = "Sunday"; break; case 1: day = "Monday"; break; case 2: day = "Tuesday"; break; case 3: day = "Wednesday"; break; case 4: day = "Thursday"; break; case 5: day = "Friday"; break; case 6: day = "Saturday"; }
Результатом дня стане поточний день тижня у денному форматі
PS: Це зміниться залежно від того, коли ви читаєте цю статтю
Я написав цю статтю 13.06.2019, яка є четвергом, тож результат буде:
Thursday
Ключове слово за замовчуванням
За замовчуванням ключове слово вказує код для запуску , якщо немає ні одного випадку , матч, більше схоже на іншу заяву:
switch (new Date().getDay()) { case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; break; default: text = "Its not weekend yet!"; }
Результатом тексту буде:
Its not weekend yet!
За замовчуванням випадок не повинен бути останнім випадком в розподільному блоці:
switch (new Date().getDay()) { default: text = "Its not weekend yet!"; break; case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; }
Якщо за замовчуванням не останній випадок у блоці перемикачів, не забудьте закінчити справу за замовчуванням перервою.Висновок
Існує так багато практичних прикладів випадків перемикань, ви можете перейти на google.com і швидко здійснити пошук інших прикладів перемикачів.
Якщо ця стаття вам допомогла, покажіть її, поділившись.
Дякуємо за читання!