switch

Eine lange Kette aus else if liest sich schlecht, wenn jeder Zweig denselben Wert gegen etwas anderes prüft. Dafür gibt es eine eigene Schreibweise.

01 / 05Der Aufbau

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

function rolle(kuerzel) {
  let text;
  switch (kuerzel) {
    case "adm":
      text = "Administration";
      break;
    case "red":
      text = "Redaktion";
      break;
    case "sup":
      text = "Support";
      break;
    default:
      text = "unbekannt";
  }
  return text;
}

console.log("adm:", rolle("adm"));
console.log("sup:", rolle("sup"));
console.log("xyz:", rolle("xyz"));

switch bekommt in runden Klammern den Wert, um den es geht. Darin steht je Fall ein case mit dem Wert, gegen den verglichen wird, ein Doppelpunkt, und darunter, was passieren soll.

break beendet den switch. default fängt alles Übrige ab, wie ein else. Beim letzten Zweig kann das break entfallen, weil danach ohnehin Schluss ist.

Steht der switch in einer Funktion, darfst du statt break auch direkt return schreiben. Das ist kürzer und erspart dir die Zwischenvariable. In dieser Lektion übst du bewusst die Fassung mit break, weil du sie in fremdem Code sehen wirst.

02 / 05Das vergessene break

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

// Hier fehlt überall das break. Schau, was dabei herauskommt.
function ampel(farbe) {
  switch (farbe) {
    case "rot":
      console.log("Halt");
    case "gelb":
      console.log("Gleich geht es los");
    case "gruen":
      console.log("Fahr");
  }
}

console.log("Bei rot:");
ampel("rot");

console.log("Bei gruen:");
ampel("gruen");

Hier fehlt in allen drei Fällen das break, und das Ergebnis überrascht: Bei rot werden alle drei Zeilen ausgegeben.

Der Grund ist, dass case kein Block ist, sondern eine Sprungmarke. Der Browser sucht die passende Marke, springt dorthin und arbeitet dann alles ab, was folgt, bis ihn etwas aufhält. Bei gruen steht nur noch eine Zeile darunter, deshalb sieht es dort richtig aus.

Das nennt sich Durchfallen, auf Englisch fall-through. Es ist mit Abstand der häufigste Fehler mit switch, und er ist tückisch, weil er nur bei manchen Eingaben auffällt.

03 / 05Wenn das Durchfallen Absicht ist

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

// Zwei case direkt untereinander teilen sich denselben Rumpf.
// Das ist genau das Durchfallen von oben, nur diesmal absichtlich.
function artDesTages(kuerzel) {
  let art;
  switch (kuerzel) {
    case "Sa":
    case "So":
      art = "Wochenende";
      break;
    default:
      art = "Werktag";
  }
  return art;
}

console.log("Sa:", artDesTages("Sa"));
console.log("So:", artDesTages("So"));
console.log("Mi:", artDesTages("Mi"));

Es gibt genau einen Fall, in dem man es nutzt: mehrere Werte, die dasselbe bedeuten.

Zwei case direkt untereinander, ohne Rumpf dazwischen, teilen sich den Block darunter. Das ist technisch dasselbe Durchfallen wie oben, nur ist es hier gewollt und gut lesbar.

Achte auf den Unterschied: Zwischen den beiden case steht nichts. Sobald eine Anweisung dazwischensteht, ist es wieder der Fehler von oben.

04 / 05switch vergleicht streng

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

function pruefe(wert) {
  switch (wert) {
    case "5":
      return "der Text Fünf";
    case 5:
      return "die Zahl Fünf";
    default:
      return "etwas anderes";
  }
}

// Kein Umwandeln, kein Vertun: es wird mit === verglichen.
console.log("Zahl 5 ergibt:", pruefe(5));
console.log("Text \"5\" ergibt:", pruefe("5"));

Verglichen wird mit ===, also mit Wert und Typ. Der Text "5" und die Zahl 5 sind für einen switch zwei verschiedene Fälle.

Das ist gut so und passt zu Lektion 3.2. Es heißt aber auch: Eine Eingabe aus einem Formular musst du vorher umwandeln, sonst trifft kein einziger case und du landest immer im default. Das ist derselbe Stolperstein wie in Lektion 2.7, nur an einer neuen Stelle.

05 / 05Wann du switch nimmst und wann nicht

Nimm switch, wenn du einen Wert gegen viele feste Möglichkeiten prüfst: Kürzel, Statuswerte, Tastennamen, Ereignistypen. Ab etwa vier Fällen liest es sich besser als eine else if-Kette, weil der geprüfte Wert nur einmal dasteht statt viermal.

Nimm if, sobald Bereiche im Spiel sind. Für „größer als 90” gibt es keinen case, dafür ist die Notenskala aus der vorigen Lektion da. Und ebenso, wenn jede Bedingung etwas anderes prüft, denn dann gibt es keinen gemeinsamen Wert, den man vorn hinschreiben könnte.

Ein letzter Hinweis für später: Wenn dein switch nur Werte zuordnet und sonst nichts tut, ist ein Objekt oft die bessere Lösung. Das siehst du in Abschnitt 7, und danach schrumpfen viele switch-Blöcke auf zwei Zeilen.