JavaScript switch-spraak

Definitie en gebruik

De switch-spraak voert codeblokken uit op basis van verschillende situaties.

De switch-spraak is een onderdeel van de 'voorwaardelijke' spraak van JavaScript, gebruikt om verschillende operaties uit te voeren op basis van verschillende voorwaarden. Gebruik switch om een van de vele codeblokken die moeten worden uitgevoerd te kiezen. Dit is een perfecte oplossing voor lange geneste if/else-spraken.

De switch-statement berekent de uitdrukking. Vervolgens wordt de waarde van de uitdrukking vergeleken met de waarde van elke case in de structuur. Als er een match is, wordt de bijbehorende codeblok uitgevoerd.

De switch-statement wordt meestal gebruikt met de break- of default-sleutel (of beide). Deze zijn optioneel:

De break-sleutel verlaat het switch-blok. Dit stopt met het uitvoeren van meer code en / of het testen van de volgende cases binnen het blok. Als break wordt overgeslagen, wordt de volgende codeblok in de switch-statement uitgevoerd.

Als er geen case overeenkomt, specificeer dan met de default-sleutel enkele code die moet worden uitgevoerd. Een switch kan maar één default-sleutel hebben. Hoewel deze optioneel is, wordt het aanbevolen om deze te gebruiken omdat deze onverwachte situaties kan afhandelen.

Example

Voer een codeblok uit op basis van de gebruikersinput:

var text;
var fruits = document.getElementById("myInput").value;
switch(fruits) {
  case "Banana":
    text = "Banana is goed!";
    break;
  case "Orange":
    text = "Ik ben geen fan van sinaasappel.";
    break;
  case "Apple":
    text = "Hoe vind je deze appels?";
    break;
  default:
    text = "Ik heb nooit van dat fruit gehoord...";
}

Try it yourself

Er zijn meer TIY voorbeelden onder de pagina.

Syntax

switch(expression) {
  case n:
    code block
    break;
  case n:
    code block
    break;
  default:
    default code block
}

Parameterwaarde

Parameter Beschrijving
expression Verplicht. Specificeer de uitdrukking die moet worden berekend. De uitdrukking wordt een keer berekend. De waarde van de uitdrukking wordt vergeleken met de waarde van elke case-label in de structuur. Als er een match is, wordt de bijbehorende codeblok uitgevoerd.

Technische details

JavaScript versie: ECMAScript 1

Meer voorbeelden

Example

Gebruik de weekday index van vandaag om de naam van de weekday te berekenen (Sunday=0, Monday=1, Tuesday=2, ...):

var day;
switch (new Date().getDay()) {
  case 0:
    day = "Zondag";
    break;
  case 1:
    day = "Maandag";
    break;
  case 2:
    day = "Dinsdag";
    break;
  case 3:
    day = "Woensdag";
    break;
  case 4:
    day = "Donderdag";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
    break;
  default:
    day = "Unknown Day";
}

Try it yourself

Example

If today is neither Saturday nor Sunday, write a default message:

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";
}

Try it yourself

Example

Sometimes you may want different cases to use the same code, or use the same default value.

Please note that in this example, cases share the same code block, and the default case does not have to be the last case in the switch block (but, if the default is not the last case in the switch block, remember to end it with a 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";
}

Try it yourself

Example

Execute code blocks using the switch statement based on user input from the prompt box:

var text;
var favDrink = prompt("What's your favorite cocktail drink?");
switch(favDrink) {
  case "Martini":
    text = "Excellent choice! Martini is good for your soul.";
    break;
  case "Daiquiri":
    text = "Daiquiri is my favorite too!";
    break;
  case "Cosmopolitan":
    text = "Really? Are you sure the Cosmopolitan is your favorite?";
    break;
  default:
    text = "I have never heard of that one..";
}

Try it yourself

Browser Support

Statement Chrome IE Firefox Safari Opera
switch Supported Supported Supported Supported Supported

Related Page

JavaScript tutorial:JavaScript If...Else Statement

JavaScript tutorial:JavaScript Switch statement

JavaScript reference manual:JavaScript if/else statement

JavaScript reference manual:JavaScript break statement