JavaScript Operatoren und Vergleiche

Operatoren sind die Bausteine, mit denen du Ausdrücke in JavaScript verarbeitest. Von einfachen mathematischen Berechnungen bis hin zu komplexen logischen Vergleichen – ohne Operatoren geht nichts. Besonders wichtig ist in JavaScript das Verständnis von Vergleichen, da die Sprache hier einige Eigenheiten hat.

Arithmetische Operatoren

Die Klassiker für mathematische Berechnungen:

console.log(10 + 5);  // Addition: 15
console.log(10 - 5);  // Subtraktion: 5
console.log(10 * 5);  // Multiplikation: 50
console.log(10 / 5);  // Division: 2
console.log(10 % 3);  // Modulo (Restwert): 1
console.log(2 ** 3);  // Potenzierung (ES2016): 8

Zuweisungsoperatoren

Neben der einfachen Zuweisung (=) gibt es kombinierte Operatoren:

let x = 10;
x += 5; // x = x + 5 (15)
x *= 2; // x = x * 2 (30)
x++;    // x = x + 1 (Inkrement, 31)

Vergleichsoperatoren: Das große “Achtung!”

In JavaScript gibt es zwei Arten von Gleichheits-Vergleichen. Das Verständnis des Unterschieds ist entscheidend, um Bugs zu vermeiden.

Abstraktes vs. Striktes Vergleichen

Abstrakte Gleichheit (==): Versucht die Typen aneinander anzupassen (Type Coercion), bevor verglichen wird.
Strikte Gleichheit (===): Vergleicht sowohl den Wert als auch den Datentyp.

console.log(5 == "5");  // true (String wird in Zahl umgewandelt)
console.log(5 === "5"); // false (Zahl vs. String)

console.log(null == undefined);  // true
console.log(null === undefined); // false

Best Practice: Nutze immer === und !==. Nur in sehr seltenen, bewussten Fällen ist == sinnvoll (z.B. Check auf null und undefined gleichzeitig).

Object.is()

Für spezielle Fälle gibt es Object.is(). Es verhält sich fast wie ===, außer bei NaN und Null-Werten:

console.log(NaN === NaN);        // false (JavaScript-Eigenheit)
console.log(Object.is(NaN, NaN)); // true

console.log(-0 === +0);           // true
console.log(Object.is(-0, +0));    // false

Logische Operatoren

const a = true;
const b = false;

console.log(a && b); // AND: false
console.log(a || b); // OR: true
console.log(!a);     // NOT: false

Nullish Coalescing (??) und Optional Chaining (?.)

Moderne JavaScript-Features (ES2020), die den Umgang mit null oder undefined erleichtern:

// Nullish Coalescing: Nutzt Fallback nur wenn Wert null/undefined ist
const name = null;
console.log(name ?? "Gast"); // "Gast"

const count = 0;
console.log(count || 10); // 10 (0 ist falsy!)
console.log(count ?? 10); // 0 (0 ist nicht null/undefined)

// Optional Chaining: Verhindert Fehler wenn Eigenschaft nicht existiert
const user = { details: { age: 25 } };
console.log(user.address?.street); // undefined (statt Error!)

Zusammenfassung

Nutze arithmetische Operatoren für Berechnungen.
Bevorzuge immer strikte Vergleiche (===).
Nutze moderne Operatoren wie Nullish Coalescing (??), um sicher mit fehlenden Werten umzugehen.
Achte auf die Präzedenz (Rangfolge) von Operatoren (Klammern helfen!).

Weiterführende Links: