🌐 JavaScript Grundlagen

JS 02: Kontrollfluss, Verzweigungen & Schleifen

Lerne Entscheidungslogik mit if/else, switch und den mächtigen Schleifenkonstrukten in modernem JavaScript.

💡 1. Verzweigungen & Strikter Vergleich (===)

Bedingte Anweisungen steuern, welche Codeblöcke bei bestimmten Bedingungen ausgeführt werden. In modernem JavaScript verwenden wir ausnahmslos den strikten Vergleich === (bzw. !==), um ungewollte Typumwandlungen zu verhindern:

const alter = 17;

if (alter >= 18) {
  console.log("Zugang gewährt: Volljährig");
} else if (alter >= 13) {
  console.log("Jugendschutz: Eingeschränkter Zugang");
} else {
  console.log("Kindersicherung aktiv");
}

// ⚠️ Strikter Vergleich:
console.log(42 === "42"); // false (Number !== String)
console.log(42 == "42");  // true  (Achtung: Gefährliche implizite Konvertierung!)

🔀 2. Switch-Case & Ternärer Operator

Wenn du eine Variable gegen viele konkrete Werte prüfen möchtest, sorgt switch für sauberen Code. Für schnelle Zuweisungen ist der ternäre Operator (? :) die beste Wahl:

// 🎯 Switch-Case:
const rolle = "admin";
switch (rolle) {
  case "admin":
    console.log("Volle Administrationsrechte");
    break; // Verhindert 'Fall-Through'
  case "editor":
    console.log("Inhalte bearbeiten");
    break;
  default:
    console.log("Gastzugang (Nur Lesen)");
}

// 🎯 Ternärer Operator (Bedingung ? Wenn-Wahr : Wenn-Falsch):
const hatRabatt = true;
const endpreis = hatRabatt ? 80 : 100;

🔄 3. Schleifen: for, for...of, while

Wiederhole Operationen präzise. Mit break brichst du eine Schleife vorzeitig ab, mit continue springst du sofort zum nächsten Durchlauf:

// 1. Zählschleife:
for (let i = 1; i <= 5; i++) {
  if (i === 3) continue; // Überspringt die 3
  console.log(i); // 1, 2, 4, 5
}

// 2. Iteration über Arrays (for...of):
const zutaten = ["Mehl", "Zucker", "Eier"];
for (const zutat of zutaten) {
  console.log("Zutat:", zutat);
}

// 3. Bedingungsschleife:
let countdown = 3;
while (countdown > 0) {
  console.log(countdown--);
}
🚦 Didaktische Analogie: Die Verkehrsampeln & Kreisverkehre im Code

Die Ampelkreuzung (if/else/switch): Je nachdem, welches Signal aufleuchtet, nimmt dein Datenstrom eine andere Abbiegung. switch ist der mehrspurige Kreisverkehr mit festen Ausfahrten.

Der Kreisverkehr (while/for): Dein Code kreist so lange, wie die Bedingung wahr ist. Mit continue fährst du ohne Halt in die nächste Runde, mit break nimmst du sofort die nächste Ausfahrt ins Freie!

📑 4. Cheat-Sheet: Kontrollfluss & Schleifen

Konstrukt Beispiel Zweck
if / else if / else if (x > 0) { ... } Verzweigung nach Wahrheitswerten
switch(wert) { case ...: } case 1: return "Mo"; break; Gezielte Prüfung auf diskrete Werte
bed ? a : b const s = a >= 18 ? 'Erw' : 'Kind'; Kompakter ternärer Ausdruck
for (let i = 0; i < n; i++) for (let i = 0; i < 10; i++) Zählschleife mit Index-Schritten
for (const x of array) for (const item of items) Direkte Element-Iteration
while (bed) / do..while while (n > 0) n--; Bedingungsgesteuerte Schleifen
break / continue if (i % 2 !== 0) continue; Schleifenabbruch / Nächster Durchlauf

🎯 Aufgaben & Checkliste in aufgabe.js

💡 Tipp für Teilziel 4 & 5

Für ungerade Zahlen kannst du if (i % 2 !== 0) continue; schreiben. Bei findeErstesVielfaches beende die Schleife mit break, sobald zahl % teiler === 0 zutrifft!

💻 In Web-IDE öffnen → ← Zurück zu JS 01 Weiter zu JS 03 →