Instrukcja switch w JavaScript

Definicja i użycie

Instrukcja switch wykonuje bloki kodu w zależności od różnych sytuacji.

Switch instrukcja jest częścią 'warunkowych' instrukcji w JavaScript, używaną do wykonywania różnych operacji w zależności od różnych warunków. Używa się switch, aby wybrać jeden z wielu kodów do wykonania. Jest to idealne rozwiązanie dla długich wcięć if/else.

Switch oblicza wyrażenie. Następnie wartość wyrażenia jest porównywana z wartością każdego przypadku w strukturze. Jeśli będą pasować, wykona się powiązany blok kodu.

Zwykle używa się switch z kluczami word break lub default (lub obu). Te są opcjonalne:

Klucz word break opuszcza blok switch. To zatrzymuje wykonywanie więcej kodu i / lub testowanie przypadków w bloku. Jeśli pominie się break, wykona się następny blok kodu w switch.

Jeśli żaden z case nie pasuje, klucz word default określa, jakie kod ma być uruchomiony. Można mieć tylko jeden klucz word default w jednym switch. Choć jest opcjonalny, zaleca się jego użycie, ponieważ może on obsługiwać nieoczekiwane przypadki.

Przykład

Wykonaj blok kodu na podstawie wprowadzenia użytkownika:

var text;
var fruits = document.getElementById("myInput").value;
switch(fruits) {
  case "Banana":
    text = "Banana jest dobra!";
    break;
  case "Orange":
    text = "Nie jestem fanem pomarańczy.";
    break;
  case "Apple":
    text = "Jak ci smakują te jabłka?";
    break;
  default:
    text = "Nie słyszałem o tym owocie...";
}

Spróbuj sam

Poniżej znajduje się więcej przykładów TIY.

Gramatyka

switch(expression) {
  case n:
    Blok kodu
    break;
  case n:
    Blok kodu
    break;
  default:
    Blok kodu domyślny
}

Wartość parametru

Parametr Opis
expression Wymagane. Określ wyrażenie do obliczenia. Wyrażenie zostanie obliczone raz. Wartość wyrażenia zostanie porównana z wartością każdej etykiety case w strukturze. Jeśli będą pasować, wykona się odpowiedni blok kodu.

Szczegóły techniczne

Wersja JavaScript: ECMAScript 1

Więcej przykładów

Przykład

Oblicz nazwę dnia tygodnia na podstawie numeru weekday dzisiejszego (Sunday=0, Monday=1, Tuesday=2, ...):

var day;
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";
    break;
  default:
    day = "Unknown Day";
}

Spróbuj sam

Przykład

Jeśli dzisiaj nie jest ani sobota, ani niedziela, napisz wiadomość domyślną:

var text;
switch (new Date().getDay()) {
  case 6:
    text = "Today is Saturday";
    break; 
  case 0:
    text = "Today is Sunday";
    break; 
  default: 
    text = "Looking forward to the Weekend";
}

Spróbuj sam

Przykład

Czasami możesz chcieć, aby różne przypadki używały tego samego kodu lub tego samego wartości domyślnej.

Proszę zauważyć, że w tym przykładzie, przypadki dzielą ten sam blok kodu, a case domyślne nie musi być ostatnim case w bloku switch (ale pamiętaj, że jeśli case domyślne nie jest ostatnim case w bloku switch, pamiętaj, aby zakończyć go break).

var text;
switch (new Date().getDay()) {
  case 1:
  case 2:
  case 3:
  default: 
    text = "Looking forward to the Weekend";
    break; 
  case 4:
  case 5:
    text = "Soon it is Weekend";
    break; 
  case 0:
  case 6:
    text = "It is Weekend";
}

Spróbuj sam

Przykład

Na podstawie wprowadzonego przez użytkownika tekstu w oknie dialogowym, wykonaj blok kodu za pomocą zdania switch:

var text;
var favDrink = prompt("What's your favorite cocktail drink?"));
switch(favDrink) {
  case "Martini":
    text = "Wspaniały wybór! Martini jest dobry dla duszy.";
    break;
  case "Daiquiri":
    text = "Daiquiri to także mój ulubiony!";
    break;
  case "Cosmopolitan":
    text = "Naprawdę? Jesteś pewien, że Cosmopolitan to twój ulubiony?";
    break;
  default:
    text = "Nigdy nie słyszałem o tym...";
}

Spróbuj sam

Obsługa przeglądarek

zdanie Chrome IE Firefox Safari Opera
switch Obsługa Obsługa Obsługa Obsługa Obsługa

Powiązane strony

Tutorial JavaScript:JavaScript If...Else zdanie

Tutorial JavaScript:Złożenie Switch w JavaScript

Podręcznik referencyjny JavaScript:Złożenie if/else w JavaScript

Podręcznik referencyjny JavaScript:Złożenie break w JavaScript