Mehrere Fälle mit `else if`
Wenn eine Entscheidung mehr als zwei Möglichkeiten hat
Mit if und else kannst du zwischen zwei Fällen unterscheiden:
- Bedingung ist wahr
- Bedingung ist nicht wahr
Oft gibt es aber mehr Möglichkeiten. Zum Beispiel soll ein Programm je nach Punktzahl eine andere Rückmeldung geben:
- ab 90 Punkten: „Sehr gut“
- ab 75 Punkten: „Gut“
- ab 50 Punkten: „Bestanden“
- darunter: „Leider nicht bestanden“
Dafür verwendest du else if.
Die Grundstruktur
if (bedingung1) {
// Dieser Code läuft, wenn bedingung1 wahr ist.
} else if (bedingung2) {
// Dieser Code läuft, wenn bedingung1 falsch
// und bedingung2 wahr ist.
} else {
// Dieser Code läuft, wenn keine Bedingung wahr ist.
}
JavaScript prüft die Bedingungen von oben nach unten:
- Ist die erste Bedingung wahr? Dann wird ihr Code ausgeführt.
- Andernfalls prüft JavaScript die nächste
else if-Bedingung. - Sobald eine Bedingung wahr ist, werden die übrigen Fälle übersprungen.
- Wenn keine Bedingung zutrifft, läuft der Code im
else-Block.
Wichtig: Von einer
if-else if-else-Kette wird immer nur ein Block ausgeführt.
Beispiel: Eine Punktzahl auswerten
const punkte = 82;
if (punkte >= 90) {
console.log("Sehr gut!");
} else if (punkte >= 75) {
console.log("Gut gemacht!");
} else if (punkte >= 50) {
console.log("Bestanden.");
} else {
console.log("Leider nicht bestanden.");
}
Die Variable punkte enthält den Wert 82.
JavaScript prüft nun nacheinander:
- Ist
82 >= 90? Nein. - Ist
82 >= 75? Ja.
Deshalb erscheint in der Konsole:
Gut gemacht!
Die folgenden Fälle werden nicht mehr geprüft, weil JavaScript bereits einen passenden Fall gefunden hat.
Die Reihenfolge ist entscheidend
Bei mehreren Bedingungen muss die genaueste oder höchste Bedingung zuerst stehen.
Dieses Beispiel ist korrekt:
const alter = 17;
if (alter >= 18) {
console.log("Du bist volljährig.");
} else if (alter >= 16) {
console.log("Du darfst bestimmte Angebote nutzen.");
} else {
console.log("Du bist noch unter 16.");
}
Für alter = 17 ist die erste Bedingung falsch, die zweite aber wahr. Die Ausgabe lautet:
Du darfst bestimmte Angebote nutzen.
Ein häufiger Fehler
Schau dir diese vertauschte Reihenfolge an:
const punkte = 95;
if (punkte >= 50) {
console.log("Bestanden.");
} else if (punkte >= 75) {
console.log("Gut gemacht!");
} else if (punkte >= 90) {
console.log("Sehr gut!");
}
Die Ausgabe ist:
Bestanden.
Das ist zwar technisch korrekt, aber vermutlich nicht gewollt. Denn 95 ist bereits größer oder gleich 50. JavaScript führt deshalb den ersten Block aus und prüft die restlichen Bedingungen nicht mehr.
Besser: Beginne bei solchen Wertebereichen mit dem höchsten Wert.
const punkte = 95;
if (punkte >= 90) {
console.log("Sehr gut!");
} else if (punkte >= 75) {
console.log("Gut gemacht!");
} else if (punkte >= 50) {
console.log("Bestanden.");
} else {
console.log("Leider nicht bestanden.");
}
Jetzt lautet die Ausgabe:
Sehr gut!
Mehrere konkrete Werte prüfen
else if eignet sich auch, wenn eine Variable verschiedene feste Werte annehmen kann.
const wochentag = "Samstag";
if (wochentag === "Montag") {
console.log("Die Woche beginnt.");
} else if (wochentag === "Freitag") {
console.log("Fast Wochenende!");
} else if (wochentag === "Samstag" || wochentag === "Sonntag") {
console.log("Wochenende!");
} else {
console.log("Ein normaler Wochentag.");
}
Hier wird zusätzlich der logische Operator || verwendet. Er bedeutet „oder“.
Die Bedingung
wochentag === "Samstag" || wochentag === "Sonntag"
ist wahr, wenn mindestens eine der beiden Teilbedingungen wahr ist.
else ist optional
Ein abschließendes else musst du nicht immer schreiben. Es ist sinnvoll, wenn dein Programm auch für alle übrigen Fälle eine Reaktion zeigen soll.
Ohne else:
const temperatur = 24;
if (temperatur < 0) {
console.log("Es friert.");
} else if (temperatur < 15) {
console.log("Es ist kühl.");
} else if (temperatur > 30) {
console.log("Es ist heiß.");
}
Bei 24 erscheint keine Ausgabe, denn keine Bedingung trifft zu.
Mit einem abschließenden else kannst du diesen normalen Bereich auffangen:
const temperatur = 24;
if (temperatur < 0) {
console.log("Es friert.");
} else if (temperatur < 15) {
console.log("Es ist kühl.");
} else if (temperatur > 30) {
console.log("Es ist heiß.");
} else {
console.log("Die Temperatur ist angenehm.");
}
Verschachtelte Bedingungen vermeiden
Du könntest mehrere Bedingungen auch ineinander schreiben:
const rolle = "admin";
if (rolle === "admin") {
console.log("Du hast alle Rechte.");
} else {
if (rolle === "mitglied") {
console.log("Du bist angemeldet.");
} else {
console.log("Du bist ein Gast.");
}
}
Das funktioniert, ist aber unnötig unübersichtlich. Mit else if ist derselbe Code klarer:
const rolle = "admin";
if (rolle === "admin") {
console.log("Du hast alle Rechte.");
} else if (rolle === "mitglied") {
console.log("Du bist angemeldet.");
} else {
console.log("Du bist ein Gast.");
}
Verwende else if, wenn die Fälle alternativ sind: Es soll genau eine passende Antwort ausgewählt werden.
Typische Fehlerquellen
= statt === verwenden
Für Vergleiche brauchst du meistens ===.
const farbe = "blau";
if (farbe === "blau") {
console.log("Die Farbe ist blau.");
}
Ein einzelnes = weist dagegen einen Wert zu:
farbe = "rot";
In einer Bedingung führt das oft zu Fehlern oder unerwartetem Verhalten.
Überlappende Bedingungen falsch sortieren
Bei Zahlenbereichen überschneiden sich Bedingungen häufig. Zum Beispiel trifft bei einer Punktzahl von 90 sowohl punkte >= 50 als auch punkte >= 75 und punkte >= 90 zu.
Darum gilt:
- höchste Grenze zuerst
- niedrigste Grenze zuletzt
- einen Restfall mit
elseergänzen, wenn nötig
else if nach else schreiben
Ein else muss immer am Ende stehen. Das wäre falsch:
if (alter >= 18) {
console.log("Volljährig");
} else {
console.log("Minderjährig");
} else if (alter >= 16) {
console.log("16 oder älter");
}
Sobald JavaScript bei else angekommen ist, gibt es keinen weiteren Bedingungsfall mehr. Schreibe else if daher immer vor else.
Praxisbeispiel: Versandkosten bestimmen
In einem Online-Shop hängen die Versandkosten vom Bestellwert ab:
- ab 50: kostenloser Versand
- ab 25: Versand kostet 2,99
- darunter: Versand kostet 4,99
const bestellwert = 32;
if (bestellwert >= 50) {
console.log("Der Versand ist kostenlos.");
} else if (bestellwert >= 25) {
console.log("Der Versand kostet 2,99 Euro.");
} else {
console.log("Der Versand kostet 4,99 Euro.");
}
Für einen Bestellwert von 32 wird ausgegeben:
Der Versand kostet 2,99 Euro.
Ändere den Wert von bestellwert und beobachte, wie sich die Ausgabe verändert.
Übung: Ticketpreis berechnen
Schreibe ein Programm mit einer Variable alter.
Die Regeln lauten:
- Kinder unter 6 Jahren fahren kostenlos.
- Personen unter 18 Jahren zahlen den Jugendpreis.
- Personen ab 65 Jahren erhalten einen Seniorenpreis.
- Alle anderen zahlen den normalen Preis.
Gib jeweils einen passenden Text in der Konsole aus.
Teste zum Beispiel diese Werte: 4, 15, 30 und 70.
Eine mögliche Lösung
const alter = 15;
if (alter < 6) {
console.log("Dein Ticket ist kostenlos.");
} else if (alter < 18) {
console.log("Du zahlst den Jugendpreis.");
} else if (alter >= 65) {
console.log("Du zahlst den Seniorenpreis.");
} else {
console.log("Du zahlst den normalen Preis.");
}
Beachte die Reihenfolge:
- Zuerst wird geprüft, ob die Person noch ein Kind ist.
- Danach folgt der Jugendpreis.
- Anschließend wird der Seniorenpreis geprüft.
- Das abschließende
elsegilt für alle Erwachsenen zwischen 18 und 64 Jahren.
Merke dir
- Mit
else ifkannst du mehrere alternative Fälle formulieren. - JavaScript prüft die Bedingungen von oben nach unten.
- Sobald eine Bedingung wahr ist, wird nur ihr Codeblock ausgeführt.
- Bei überlappenden Zahlenbereichen steht die höchste Grenze zuerst.
- Ein
elsefängt alle Fälle auf, die zu keiner vorherigen Bedingung passen.