Водич за ЈаваСцрипт Свитцх изјаву са примерима

by
Tweet
Share
Share
Pin

Наредба ЈаваСцрипт Свитцх је условна изјава тока контроле. Невероватно је користан за креирање условних блокова са пуно клаузула.

Овај чланак је водич о наредби свитцх и како да је користите. Такође ћемо га упоредити са другим условним конструкцијама, иф изјавама и тернарним операторима, тако да ћете можда знати када да користите сваки од њих.

Шта је наредба Свитцх у ЈаваСцрипт-у?

Наредба ЈаваСцрипт Свитцх се користи да одлучи коју грану кода да се изврши на основу вредности израза. То је једна од две условне изјаве у ЈаваСцрипт-у.

Први је иф-наредба, а други је тернарни оператор. Функционише слично као ова два, али има различите нијансе, што га чини идеалним за неке случајеве. У овом чланку ћемо све то истражити.

Како користити ЈаваСцрипт Свитцх изјаву

У овом делу чланка ћу објаснити ЈаваСцрипт Свитцх Статемент и како га користити. Користићу примере кода, тако да ће вам требати ЈаваСцрипт компајлер да бисте га пратили. Најједноставнији за употребу је овај онлајн ЈаваСцрипт компајлер. Алтернативно, можете погледати наш чланак о најбољим онлајн ЈаваСцрипт ИДЕ-овима.

Општа синтакса

Општа синтакса за наредбу свитцх је следећа:

switch(<expression>) {
    case <value 1>:
        <statements>
        break;
    case <value 2>:
        <statements>
        break;
    default:
        <statements>
}

Кључна реч свитцх означава почетак ЈаваСцрипт блока прекидача. Унутар заграда стављате било који ЈаваСцрипт израз. Израз је све што вреднује вредност. На пример, литерали као што су стрингови или бројеви, променљиве или позиви функција.

Затим додајемо тело наредбе свитцх између витичастих заграда. Тело се састоји од неколико кућишта. Сваки случај има вредност и групу исказа. Ако је израз између заграда једнак вредности случаја, онда се наредбе тог случаја извршавају.

  Како уклонити „Често посећено“ на Сафарију (иПхоне и Мац)

За сваки случај можемо додати кључну реч бреак. Додавање ове речи је потпуно опционо. Ако га додате, ЈаваСцрипт излази из блока прекидача када га наиђе. Ако није присутан, ЈаваСцрипт ће наставити да покреће све случајеве након њега. Ово је познато као пад. Осим ако не желите да искористите предности пада, препоручује се да додате кључну реч бреак.

Последња кључна реч коју треба узети у обзир је подразумевана кључна реч. Овај случај одговара било којој вредности израза између заграда.

Примери

Овај одељак ће демонстрирати различите примере коришћења наредбе свитцх.

#1. Витх Фаллтхроугх

Ево примера коришћења наредбе свитцх без кључне речи бреак. Сврха овога је да се демонстрира пад.

У овом примеру, пишемо код за руковање различитим ХТТП статусним кодовима:

const statusCode = <insert status code here>

switch (statusCode) {
    case 200:
        console.log('OK');
    case 301:
        console.log('Redirect');
    case 403:
        console.log('Forbidden');
    case 404:
        console.log('Not Found');
    case 500:
        console.log('Internal Server Error')
}

У горенаведеном исечку кода проверавамо да ли је вредност једнака одређеном статусном коду, а затим одштампамо поруку која описује статусни код.

Посматрајте шта се дешава када статусни код поставите на 403.

Након упаривања 403 случаја, упарени су и сви следећи случајеви. Ово се зове пад. Ово није идеално, јер често волимо да ускладимо један случај. Ова чудна појава ЈаваСцрипт-а је разлог зашто је неопходно додати кључну реч бреак.

#2. Витхоут Фаллтхроугх

Да бисмо избегли пад, додајемо кључну реч бреак на крају сваког случаја. Следећи пример показује шта се дешава када то урадите.

const statusCode = <insert a status code here>

switch (statusCode) {
    case 200:
        console.log('OK');
        break;
    case 301:
        console.log('Redirect');
        break;
    case 403:
        console.log('Forbidden');
        break;
    case 404:
        console.log('Not Found');
        break;
    case 500:
        console.log('Internal Server Error')
        break;
}

А када покренете горњи код са статусним кодом 403, добићете ово.

  Прегоревање ОЛЕД екрана: колико треба да будете забринути?

Као што видите, код сада одговара само једном случају и избегава пад.

#3. Корисно Фаллтхроугх

Уз то, важно је напоменути да пропуштање може бити корисно у неким случајевима. Размотрите следећи пример где желимо да проверимо да ли се особа креће хоризонтално или вертикално на основу усмереног уноса.

const direction = '<enter direction here>'

switch(direction) {
    case 'left':
    case 'right':
        console.log('horizontal movement');
        break;
    case 'up':
    case 'down':
        console.log('horizontal movement');
        break;
}

Ако поставите смер улево и покренете горњи код, ово је резултат:

А када поставите правац удесно, и даље ћете добити исти резултат:

То је зато што када се лева мала слова поклапа, она пада на десну и штампа „хоризонтално кретање“. Али пошто постоји кључна реч бреак, она не пада на велика слова. Када се поклапа прави случај, покреће наредбе у правом случају и прекида.

Према томе, ‘хоризонтално кретање’ се приказује када је смер лево или десно. Према томе, пропадање вам омогућава да креирате логику ИЛИ у вашем коду.

#4. Подударање опсега

ЈаваСцрипт свитцх наредба проверава да ли је вредност случаја једнака вредности израза. Ако је тако, извршава наредбе у том случају. Међутим, понекад ћете желети да проверите да ли је вредност у датом опсегу. Опсези подударања могу бити незгодни, али исечак кода испод показује решење.

У доњем примеру имплементирамо програм који, уз оцену, исписује оцену. На пример, ако је ознака изнад 90, програм ће штампати А+. Ако је изнад 80, али мање од 90, штампаће А и тако даље.

Да бих то урадио, ставио сам израз труе унутар заграда. Затим, вредност сваког случаја је дефинисана као логичка операција која ће бити тачна само ако је ознака у опсегу за тај случај. На пример, последња ознака случаја >= 90 биће тачна само ако је ознака већа или једнака 90. Према томе, она ће одговарати вредности израза пошто је труе једнако тачно.

const mark = <replace with any mark>;

switch (true) {
    case mark >= 50 && mark < 60:
        console.log('D');
        break;
    case mark >= 60 && mark < 70:
        console.log('C');
        break;
    case mark >= 70 && mark < 80:
        console.log('B');
        break;
    case mark >= 80 && mark < 90:
        console.log('A')
        break;
    case mark >= 90:
        console.log('A+')
        break;
    default:
        console.log('<50')
}

Излаз кода изнад када је ознака постављена на 80 је:

  Како да видите сопствене лајкове на Твитеру

А када је ознака постављена на 95:

А када је ознака 45:

Лекицал Сцопинг

Изјаве унутар случаја у прекидачу нису лексички обухваћене. То значи да ће променљиве дефинисане у једном случају бити доступне у другом случају. Ово је важно знати док пишете блокове прекидача у којима ће се подударати више од једног случаја. Ево примера да ово боље објасним:

switch (true) {
    case true:
        let num = 10
    case true:
        console.log(num);
}

У горенаведеном исечку кода оба случаја се подударају. У првом случају дефинишемо променљиву нум; у другом приступамо његовој вредности. Нећемо добити никакве грешке, као што можете видети на снимку екрана испод:

Разлика између изјаве за пребацивање и других услова

Изјава Свитцх је погоднија за сценарије у којима тестирате за више услова. Наредба иф је погодна за услове у којима тестирате 2 или 3 услова. Тернарни оператор је добар само за услове када желите да изразите услов као једноредни.

Ради краткоће, требало би да се одлучите да прво напишете тернарне операторе. Ако је немогуће изразити логику у тернарном оператору, онда можете користити иф-наредбу. Али ако то није могуће, одлучите се за изјаву свитцх.

Закључак

Овај чланак је покрио наредбу свитцх, како је користити и њене чудне карактеристике. Такође смо покрили када га користити.

Следеће, можда ћете желети да углачате ЈаваСцрипт користећи ове ЈаваСцрипт варалице.