🧱Grundlagen
Werte und Typen, Variablen, Operatoren, Wahrheitswerte und Kontrollfluss. Alle Ergebnisse auf dieser Seite werden in deinem Browser berechnet bzw. im Sandbox-Worker ausgeführt.
🔤Werte und Typen
| Wert | typeof wert | Art | Hinweis |
|---|
typeof null === "object" ist ein Fehler aus der allerersten Implementierung von 1995, der aus Kompatibilitätsgründen nie behoben wurde. Auf null prüft man mit wert === null.Primitive Werte werden kopiert, Objekte referenziert
1let a = 5;2let b = a; // Wert wird kopiert3b = 7;4let o1 = { n: 1 };5let o2 = o1; // Referenz wird kopiert6o2.n = 2;
Primitive Werte (Zahl, String, Boolean, …) stehen direkt in der Variablen.
📌let, const und var
| Scope | Hoisting | TDZ | neu deklarierbar | neu zuweisbar | Eigenschaft des globalen Objekts | |
|---|---|---|---|---|---|---|
| var | Funktion | ja, mit undefined | nein | ja | ja | ja (window.x) |
| let | Block | ja, ohne Wert | ja | nein | ja | nein |
| const | Block | ja, ohne Wert | ja | nein | nein | nein |
Hoisting und Temporal Dead Zone im Debugger
Bevor eine Zeile läuft, legt die Engine für jeden Scope alle Bindungen an (Erzeugungsphase). Der Anfangszustand wird hier aus dem Code berechnet; die Ausgaben sind gegen echtes Node geprüft.
1console.log(x);2var x = 5;3console.log(x);
| var | x | undefined |
💡 Die Deklaration var x wird beim Anlegen des Scopes verarbeitet, die Zuweisung = 5 bleibt an ihrer Stelle.
➗Operatoren
Rechnen und der +-Operator
1console.log(7 / 2, 7 % 2, 2 ** 10);2console.log(1 + 2 + "3"); // links nach rechts3console.log("1" + 2 + 3);4console.log("3" * "4"); // * wandelt in Zahlen um5console.log(0.1 + 0.2);
+ verkettet, sobald ein Operand ein String ist. 0.1 + 0.2 ist nicht genau 0.3 – Zahlen sind 64-Bit-Gleitkommazahlen (IEEE 754).
&&, || und ?? liefern Operanden
1console.log("a" && "b"); // erster falsy oder letzter2console.log(0 || "Standard"); // erster truthy oder letzter3console.log(0 ?? "Standard"); // nur null/undefined zählen4let zaehler = null;5zaehler ??= 10;6console.log(zaehler);
Logische Operatoren geben nicht true/false zurück, sondern einen der Operanden. ?? (ES2020) greift nur bei null und undefined.
Optional Chaining ?.
1const nutzer = { profil: { name: "Ada" } };2console.log(nutzer.profil?.name);3console.log(nutzer.adresse?.stadt);4console.log(nutzer.gruss?.());
?. bricht bei null/undefined ab und liefert undefined statt eines TypeErrors – auch bei Methodenaufrufen.
Vergleiche
1console.log(2 < 12, "2" < "12"); // Zahl vs. Text2console.log(null >= 0, null == 0);3console.log(typeof typeof 1);
Zwei Strings werden zeichenweise verglichen ("2" > "1"). null wird bei < > <= >= zu 0, bei == aber nicht umgewandelt.
✅Truthy und Falsy
falsy (0)
Das sind alle falsy-Werte der Sprache (plus das historische document.all im Browser).
truthy (Auswahl)
Alles andere ist truthy – auch leere Arrays, leere Objekte und der String "0".
🔀Kontrollfluss
if / else und switch
1const note = 2;2if (note === 1) console.log("sehr gut");3else if (note <= 3) console.log("bestanden");4else console.log("nicht bestanden");56switch ("b") {7 case "a": console.log("A");8 case "b": console.log("B");9 case "c": console.log("C (fall-through!)");10 break;11 default: console.log("nie");12}
switch vergleicht mit === und läuft ohne break in den nächsten case weiter.
for, for…of, for…in
1const farben = ["rot", "grün"];2for (let i = 0; i < farben.length; i++) console.log(i, farben[i]);3for (const f of farben) console.log("of:", f); // Werte4for (const k in farben) console.log("in:", k); // Schlüssel (Strings!)5for (const [k, v] of Object.entries({ a: 1 })) console.log(k, v);
for…of durchläuft Werte eines Iterables, for…in die aufzählbaren Schlüssel eines Objekts – für Arrays meist nicht, was man will.
while, break und continue
1let n = 0;2while (true) {3 n++;4 if (n % 2 === 0) continue; // gerade überspringen5 if (n > 7) break; // Schleife verlassen6 console.log(n);7}