Lädt...

If und Else

Logische Operatoren lieferten dir ein Ja/Nein. Die nächste Frage: Welche Zeilen sollen laufen? Bei Ja einen Block, bei Nein einen anderen. Diese Wahl ist if / else / else if. Du kannst schon Booleans bauen; hier wählst du damit den Pfad.

Was macht if?

if prüft die Bedingung in Klammern. Ist der Wert truthy, führt JavaScript den Block in geschweiften Klammern direkt danach aus. Ist er falsy, wird dieser Block übersprungen. else ist der Ausweichpfad, wenn if scheiterte. else if hängt vor dem finalen else eine weitere Prüfung an.

Die Schlüsselwörter im Überblick

📊 Alltägliche if / else Bausteine

Schlüsselwort Alltagslesart Typische Nutzung
if wenn das passt, diesen Block ausführen erster Check
else if sonst, wenn dieser andere Check passt… mittlere Pfade
else andernfalls dies ausführen letzter Fallback

Halte die Bedingung klar: ein Vergleich (age >= 18), eine logische Verknüpfung (age >= 18 && score >= 60) oder eine deutliche Boolean-Variable. Die Arbeit dieses Pfads gehört in { … }.

Einfaches if

javascript 
let age = 20;
if (age >= 18) {
console.log("adult");
}
console.log("done");

if läuft nur bei bestandenem Check

Hier ist age gleich 20, also ist age >= 18 wahr und die Konsole druckt adult, dann done. Setzt du age auf 16, bleibt nur done — der if-Block wurde übersprungen.

Die Zeile nach der schließenden } läuft normalerweise immer (außer du verlässt später die Funktion). if stoppt nicht das ganze Programm; es entscheidet nur, ob sein eigener Block läuft.

if mit else

javascript 
let age = 16;
if (age >= 18) {
console.log("adult");
} else {
console.log("under 18");
}

else deckt den anderen Pfad ab

Jetzt scheitert der Check; JavaScript überspringt den ersten Block und führt else aus. Du siehst under 18. Bei einem einfachen if / else-Paar läuft genau ein Zweig — nie beide, nie keiner.

else-if-Kette

javascript 
let score = 75;
if (score >= 90) {
console.log("A");
} else if (score >= 60) {
console.log("pass");
} else {
console.log("retry");
}

else if fügt Mittelwege hinzu

score ist 75. Der erste Check (>= 90) scheitert. Der zweite (>= 60) passt — du siehst pass, das finale else entfällt. Die Reihenfolge zählt: strengere Bänder zuerst, wenn sie sich überlappen.

Drei getrennte if-Anweisungen könnten mehrere Blöcke ausführen. else if hält die Pfade exklusiv — nach dem ersten Treffer stoppt die Kette.

Bedingung aus Vergleich und Logik

javascript 
let age = 20;
let score = 75;
if (age >= 18 && score >= 60) {
console.log("allowed");
} else {
console.log("blocked");
}
let ready = false;
if (!ready) {
console.log("wait");
}

Echte Checks in die Klammern

Die Bedingung darf ein Vergleich, ein logischer Ausdruck oder ein umgedrehtes Boolean sein. age >= 18 && score >= 60 ist true — du siehst allowed. !ready ist ebenfalls true — dazu kommt wait. Baue zuerst das Ja/Nein; lass if danach den Zweig wählen.

Zweigmeldung speichern

javascript 
let age = 20;
let label;
if (age >= 18) {
label = "adult";
} else {
label = "under 18";
}
console.log(label);

Das Ergebnis des Zweigs benennen

Manchmal willst du einen String (oder eine Zahl) aus der Wahl, nicht nur ein console.log. Setze label in jedem Zweig und nutze es danach einmal. Hier wird label zu "adult".

Den gewählten Pfad auf der Seite zeigen

Erzeuge mit if / else eine kurze Meldung und schreibe sie in die Seite.

Seitenzweig mit if else

html 
<!DOCTYPE html>
<html>
<head>
<title>If else — page branch</title>
</head>
<body>
<p id="out">…</p>
<script>
let age = 20;
let msg;
if (age >= 18) {
msg = "adult";
} else {
msg = "under 18";
}
let box = document.getElementById("out");
box.textContent = "status=" + msg;
</script>
</body>
</html>

age ist 20, die Seite zeigt status=adult. Setze age auf 16, lade neu — du solltest status=under 18 sehen. Die nächste Lektion (switch) wählt unter vielen festen Werten; für alltägliche Ja/Nein-Tore bleiben if / else das Werkzeug.

Selbst ausprobieren

  1. Logge "ok" in if (true) und prüfe die Ausgabe.
  2. Nutze if / else mit let age = 16 und drucke "adult" oder "under 18".
  3. Baue eine else if-Kette für score-Bänder: A (≥ 90), pass (≥ 60), sonst retry.
  4. Kombiniere age >= 18 && score >= 60 in einer if-Bedingung.
  5. Speichere einen label-String aus if / else und logge ihn einmal.
  6. Ändere im HTML-Demo nur age, lade neu, lies den neuen status=-Text.

Typische Fehler

  • Geschweifte Klammern { } um den Zweigkörper vergessen
  • if (age = 18) mit einem = (Zuweisung) statt Vergleich
  • else ohne passendes if darüber
  • Viele einzelne ifs, obwohl exklusive else if-Pfade gemeint waren
  • Lose Bänder in falscher Reihenfolge prüfen (z. B. >= 60 vor >= 90)

Kurzfassung

  • if führt einen Block aus, wenn die Bedingung truthy ist
  • else läuft, wenn dieses if scheiterte
  • else if fügt weitere exklusive Mittelwege hinzu
  • Bedingungen sind meist Vergleiche oder logische Ausdrücke
  • Jeden Zweig in Klammern halten; Label speichern, wenn du das Ergebnis später brauchst
  • Als Nächstes: Switch — Auswahl unter mehreren festen Werten

🧠 Testen Sie Ihr Wissen

Bereit zum Start

Testen Sie Ihr Wissen

Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen

❓
8
Fragen
🎯
70%
Zum Bestehen
♾️
∞
Zeit
🔄
∞
Versuche

📝 Anweisungen

  • Lesen Sie jede Frage sorgfältig
  • Wählen Sie die beste Antwort für jede Frage
  • Sie können das Quiz so oft wiederholen, wie Sie möchten
  • Ihr Fortschritt wird oben angezeigt
Thema 21 von 22
Javascript Tutorial