To na czym się skupię w dzisiejszym materiale nawiązuje do artykułu o instrukcjach warunkowych i jest ono całkowicie opcjonalne. Nie będzie się wymagało od Was koniecznie wiedzy na ten temat, aczkolwiek jest to coś, co w niektórych sytuacjach sprawi, że kod stanie się piękniejszy. Chodzi mi o instrukcję wielokrotnego wyboru, a rozpoznacie ją po słowie "switch" w języku JavaScript!

"SWITCH" W JĘZYKU JAVASCRIPT WCALE NICZEGO NIE PRZEŁĄCZA

Nie sugerujcie się angielskim w tym przypadku tak dosłownie! Chodzi o zdefiniowanie wielu ścieżek którymi program może podążyć w zależności od warunku. Przecież o czymś takim pisaliśmy sobie podczas pokazywania instrukcji warunkowych! Prawda, aczkolwiek to pisze się inaczej i zachowuje się nieco inaczej.

Zacznijmy od postaci składniowej:

switch ([zmienna])
{
    case A:
        // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa A
        break;
    
case B:
        // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa B
        break;
    
    default:
        // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] posiada inną wartość niż A oraz B
        break;
}

Mamy tu dużo szczegółów niepokazywanych w żadnej z poprzednich części więc wszystko powolutku wytłumaczę wiersz po wierszu. Pierwszą rzeczą jaką zawsze dajemy to jest to słowo kluczowe "switch" w języku JavaScript. Za nim wprowadzamy parę nawiasów okrągłych, a wewnątrz nich umieszczamy uwaga…samą nazwę zmiennej! Nie warunek jak to było przy instrukcji "if". SAMĄ ZMIENNĄ. Następnie otwieramy klamerki, a wewnątrz nich definiujemy ścieżki razem z blokami instrukcji. Mamy następne słowo kluczowe, "case"!!! To jest "otwarcie" nowego bloku instrukcji dla określonej sytuacji i TUTAJ umieszczamy warunek tylko...jest to ograniczone. O tym już za chwilę, a na razie popatrzmy na to co się dzieje dalej.

Po słowie "case" wstawiamy stałą wartość, tak samo jakbyśmy porównywali wartość zmiennej do jakiejś stałej np. czy zmienna "kilogramy" jest równa 54, a zaraz po niej ląduje dwukropek! Uważajcie na niego bowiem pominięcie go przez przypadek zostanie potraktowane jako błąd składniowy. Kiedy nagłówek z "case" jest już załatwiony, to od nowego wiersza wprowadzacie instrukcje wykonywane w przypadku, gdy wartość podanej zmiennej w "switch" będzie taka sama jak stała wartość podana po "case". Najlepiej sobie zrobić dodatkowe wcięcie, żeby podnieść czytelność i niejako podkreślić "przynależność" tychże instrukcji do warunku.

Jest coś jeszcze. Na samym końcu umieszczacie instrukcję "break", czyli macie jeszcze jedno dodatkowe słowo do kolekcji! "break" ma kilka znaczeń, a jednym z nich jest ustalenie granicy dla instrukcji w przypadku spełnienia określonego "przypadku" (trzymając się hasła "case"). Dobrze Wam radzę - niech Wam dopisywanie tego słowa wejdzie w krew ASAP!!!!! Szczegóły konsekwencji zapomnienia go umieszczam w kolejnej części artykułu!

W przypadku zażyczenia sobie zdefiniowania więcej takich bloków instrukcji, zaczynamy tak samo:

  1. "case",
  2. wartość stała,
  3. dwukropek,
  4. blok instrukcji z wcięciem,
  5. instrukcja "break",
  6. powtórzyć.

Na samym końcu możecie ujrzeć jeszcze jedno słowo kluczowe, "default". Nic strasznego, to jest po prostu odpowiednik słowa "else" w instrukcji warunkowej. Zachowuje się dokładnie tak samo. Jeżeli wszystkie przypadki zawodzą, "odzywa się" to i wykonuje wszystko zawarte wewnątrz "default".

Dla tych, którzy potrzebują porównania z zapisem tradycyjnym, tak wyglądałby odpowiednik "if'a" kropka w kropkę:

if([zmienna] === A)
{
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa A
}
else if([zmienna] === B)
{
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa B
}
else
{
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] posiada inną wartość niż A oraz B
}

BĘDĘ SZCZERY, SĄ DWA "ALE"!

Zanim pozmieniacie w nerwach wszystkie "if-else" na "switch" w języku JavaScript, muszę Was uświadomić i ostrzec! Instrukcja wielokrotnego wyboru nie składa się wyłącznie z zalety "ładniejszego wyglądania w kodzie". Poza falą nowych niespotykanych dotąd słówek kluczowych i składni mogącej sprawić ogromne trudności początkującym, posiada też w sobie pewne ograniczenie oraz perfidną pułapkę, która może spowodować mnóstwo zmarnowanych godzin i kilkaset wyrwanych włosów ze łba!!! Weźmy na razie tę lżejszą część na klatę.

TYLKO SAME PORÓWNANIA!

Instrukcja "switch" dopuści tylko te "case'y", które sprawdzają konkretną wartość. Innymi słowy, wolno Wam umieścić tylko wartość stałą! Na przykład postać 6 > 3 będzie już błędem składniowym! Zatem ze sprawdzaniem jakichś przedziałów czy wartość znajduje się w zakresie od A do B wyłącznie, możecie się pożegnać. Wtedy trzeba wrócić do "if'a"...

UWAŻAJ NA "BREAK"!!!

Ech, teraz o wiele gorsza wiadomość. Jak sprawdziłem, "switch" w języku JavaScript jest takie samo jak w języku C i ma w sobie niestety tę samą pułapkę na którą sam się dałem nabrać jak się uczyłem programowania lata temu. Do rzeczy. Przypuśćmy, że wyleci Wam z głowy wstawienie tego słowa "break" przed kolejnym "casem":

case 1:
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa 1

case 2:
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] jest równa 2

default:
    // instrukcje wykonywane wtedy i tylko wtedy, gdy [zmienna] nie jest równa ani 1, ani 2

Zdajecie sobie sprawę co to spowoduje? "Kaskadowe" wykonywanie kolejnych bloków jak leci, dopóki program nie natrafi na pierwsze "break" albo koniec instrukcji "switch"! Oznacza to, że w przypadku gdy jakaś zmienna będzie posiadała wartość 1, to wykona się pierwszy "case", ale wykona się też drugi ("case 2:") i wykona się cały blok "default", bo przed drugim "casem" także nie ma "break"!!! Teraz rozumiecie? "break" traktujcie jako taki znak STOP dla przepływu działania programu mówiący: "granica instrukcji leży tu i dalej nie idziesz!".

Jak wspomniałem, pociąga to za sobą tragiczne konsekwencje, bo "switch" w języku JavaScript WAS WCALE NIE UPRZEDZI! W żaden sposób, bo de facto to nie jest błąd w rozumieniu błędu składniowego, tylko prędzej błąd semantyczny czyli błąd polegający na działaniu programu odmiennym od zaplanowanego np. program miał policzyć pole trójkąta prostokątnego, a obliczył Wam przeciwprostokątną. Można zatem sobie śmieszkować, że jeśli nie umieścisz "break", to kod "złamie" Ciebie.

Instrukcja wielokrotnego wyboru "switch" w języku JavaScript

Instrukcja wielokrotnego wyboru tworzona jest w języku JavaScript za pomocą słowa kluczowego "switch". Potrafi uwydatnić wygląd kodu kosztem wstawiania przedziałów liczbowych w warunku.


Zostaliście uprzedzeni na temat zapisu, składni, ograniczeń i konsekwencji z tym związanych. Właśnie dlatego, że ma to swoje wady i tę pułapkę, uznaję to za wiedzę opcjonalną do opanowania. To może pomóc, ale jeśli jesteście nieostrożni, to tylko sobie zaszkodzicie!

PODOBNE ARTYKUŁY