Kurs języka HTML i CSS

Poradnik webmastera

  • Zwiększ rozmiar czcionki
  • Domyślny  rozmiar czcionki
  • Zmniejsz rozmiar czcionki

Instrukcja wyboru switch

Email Drukuj PDF

Instrukcja wyboru switch pozwala w wygodny sposób sprawdzić ciąg warunków i wykonać różne instrukcje w zależności od wyników porównywania. Ma ona ogólną postać:

switch(wyrażenie){

  case wartość1:

    instrukcje1;

    break;

  case wartość2:

    instrukcje2;

    break;

  case wartość3:

    instrukcje3;

    break;

  default:

    instrukcje4;

}

którą należy rozumieć następująco: sprawdź wartość wyrażenia wyrażenie, jeśli wynikiem jest wartość1, to wykonaj intrukcje1 i przerwij wykonywanie bloku switch (przerwanie jest wykonywane przez instrukcję break). Jeśli wynikiem jest wartość2, to wykonaj intrukcje2 i przerwij wykonywanie bloku switch, a jeśli wynikiem jest wartość3, to wykonaj intrukcje3 i przerwij wykonywanie bloku switch. Jeśli nie zachodzi żaden z wymienionych przypadków, wykonaj instrukcje4 i zakończ blok switch. Blok default jest jednak opcjonalny i może zostać pominięty.

Łatwo zauważyć, że jest to odpowiednik złożonej instrukcji if...else if w postaci:

if(wyrażenie == wartość1){

  instrukcje1;

}

else if(wyrażenie == wartość2){

  instrukcje2;

}

else if(wyrażenie == wartość3){

  instrukcje3;

}

else{

  instrukcje4;

}

Jak wykorzystać instrukcję wyboru w praktyce, obrazuje listing 2.9.

Listing 2.9. Ilustracja działania instrukcji wyboru

<script type="text/javascript">

var liczba = 10;

switch(liczba){

  case 10 :

    document.write("Zmienna liczba = 10.");

    break;

  case 20 :

    document.write("Zmienna liczba = 20.");

    break;

  default :

    document.write("Zmienna liczba nie jest równa ani 10, ani 20.");

}

</script>

Na początku została utworzona zmienna liczba o wartości 10. Poniżej została umieszczona instrukcja switch, która najpierw oblicza wartość wyrażenia występującego w nawiasie okrągłym. Ponieważ w tym przypadku jako wyrażenie występuje nazwa zmiennej, wartością wyrażenia staje się wartość tej zmiennej. Wartość ta jest porównywana do wartości występujących po słowach case, czyli 10 i 20. Jeśli zgodność zostanie stwierdzona, zostaną wykonane instrukcje występujące w danym bloku case. Jeśli nie uda się dopasować wartości wyrażenia do żadnej z wartości występujących po słowach case, jest wykonywany blok default. Ponieważ wartością wyrażenia jest 10, zgodność jest stwierdzana już w pierwszym przypadku i zostanie wykonana instrukcja document.write wyświetlająca napis: Zmienna liczba = 10. Instrukcja break, występująca po document.write, przerywa wykonywanie bloku case.

Na instrukcję break należy zwrócić szczególną uwagę. Jej przypadkowe pominięcie może doprowadzić do nieoczekiwanych wyników i błędów w skrypcie. Aby przekonać się, w jaki sposób działa instrukcja switch bez instrukcji break, zmodyfikujmy poprzedni skrypt, usuwając z niego wszystkie instrukcje break. Powstanie wtedy skrypt widoczny na listingu 2.10.

Listing 2.10. Instrukcja wyboru bez instrukcji break

<script type="text/javascript">

var liczba = 10;

switch(liczba){

  case 10 :

    document.write("Zmienna liczba = 10.");

  case 20 :

    document.write("Zmienna liczba = 20.");

  default :

    document.write("Zmienna liczba nie jest równa ani 10, ani 20.");

}

</script>

Po jego uruchomieniu w przeglądarce można będzie zobaczyć widok przedstawiony na rysunku 2.3.

Rysunek 2.3. Błąd wynikający z pominięcia instrukcji break

Skrypt wyraźnie nie spełnia swojego zadania. Zmienna nie może przecież jednocześnie spełniać trzech przeciwstawnych warunków. Jak więc działała przedstawiony kod? Otóż jeśli w którymś z bloków (przypadków) case zostanie wykryta zgodność z wyrażeniem występującym za switch, zostaną wykonane wszystkie dalsze instrukcje, aż do napotkania instrukcji break lub dotarcia do końca instrukcji switch. W prezentowanym kodzie zgodność jest stwierdzana już w pierwszym bloku case, jest więc wykonywana znajdująca się w nim instrukcja document.write. Ponieważ jednak w bloku tym nie ma instrukcji break, są wykonywane instrukcje znajdujące się w kolejnym bloku case (case 20). W tym bloku również brakuje break, a zatem są wykonywane instrukcje znajdujące się po słowie default. Tym samym wykonane zostaną wszystkie znajdujące się w kodzie instrukcje document.write.

Takie działanie instrukcji switch to jednak nie tylko źródło potencjalnych błędów. Ta właściwość może być z powodzeniem używana w skryptach. Na listingu 2.11 widoczny jest kod, w którym z założenia pominięte zostały niektóre instrukcje break.

Listing 2.11. Pominięcie instrukcji break

<script type="text/javascript">

var liczba = 30;

switch(liczba){

  case 10 :

  case 20 :

    document.write("Zmienna liczba jest równa 10 lub 20.");

    break;

  case 30 :

  case 40 :

    document.write("Zmienna liczba jest równa ani 30, ani 40.");

    break;

  default :

    document.write("Zmienna liczba jest różna od 10, 20, 30 i 40.");

}

</script>

Rozpatrywane są trzy sytuacje: kiedy zmienna liczba jest równa 10 lub 20 (pierwsze dwa bloki case), kiedy zmienna liczba jest równa 30 lub 40 (trzeci i czwarty blok case) oraz gdy zmienna liczba jest różna od 10, 20, 30 i 40 (blok default). Jest to możliwe ze względu na pominięcie instrukcji w blokach case 10 i case 30. Dzięki temu, gdy zmienna liczba będzie równa 10, zostaną wykonane wszystkie instrukcje, aż do najbliższej instrukcji break (czyli instrukcje z bloku case 20). Podobnie będzie, gdy liczba będzie równa 30. Zostaną wykonane wszystkie kolejne instrukcje, aż do napotkania break, czyli instrukcje z bloku case 40.

W ten sposób możliwe jest wykonywanie jednego zestawu instrukcji dla kilku różnych wartości zmiennej (dokładniej: wyrażenia występującego w instrukcji switch).

 

JavaScript. Nieoficjalny podręcznik

JavaScript.
Nieoficjalny podręcznik

JavaScript. Pierwsze starcie

JavaScript.
Pierwsze starcie

JavaScript. Praktyczny kurs

JavaScript.
Praktyczny kurs

Nowości Helionu

Statystyki

Użytkowników : 766
Artykułów : 513
Zakładki : 28
Odsłon : 15464211