Signatur
Beschreibung
Der Nullish-Coalescing-Operator (??) ist ein logischer Operator, der als kompakter Fallback-Mechanismus eingesetzt wird. Er gibt den rechten Operanden zurück, sobald der linke Operand exakt null oder undefined ist. In allen anderen Fällen – also auch bei 0, "", false oder NaN – liefert er den linken Operanden zurück.
Damit unterscheidet er sich fundamental vom logischen ODER-Operator (||), der alle falsy-Werte (einschließlich 0, "", false) verwirft und auf den rechten Operanden ausweicht. ?? behandelt nur echte „fehlende" Werte (null/undefined) als Fallback-Trigger und ist daher präziser, wenn 0 oder ein leerer String gültige Werte darstellen.
Der Operator unterstützt Short-Circuit-Evaluation: Der rechte Ausdruck wird gar nicht erst ausgewertet, wenn der linke Operand weder null noch undefined ist. Das ist besonders dann nützlich, wenn die Auswertung des rechten Ausdrucks Seiteneffekte hat oder aufwändig ist.
?? lässt sich mit dem optionalen Verkettungsoperator (?.) hervorragend kombinieren, um sicher auf tief verschachtelte Eigenschaften zuzugreifen und dabei gleichzeitig einen sinnvollen Standardwert bereitzustellen. Eine direkte Kombination mit || oder && ohne Klammern ist jedoch nicht erlaubt und führt zu einem Syntaxfehler.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $leftExpr Pflicht | any | — | Der linke Operand. Ist er null oder undefined, wird der rechte Operand zurückgegeben. |
| $rightExpr Pflicht | any | — | Der rechte Operand (Fallback-Wert). Wird nur ausgewertet und zurückgegeben, wenn leftExpr den Wert null oder undefined hat. |
Rückgabewert
leftExpr zurück, sofern dieser weder null noch undefined ist. Andernfalls wird rightExpr zurückgegeben.Beispiele
Grundlegende Verwendung: Fallback für null und undefined
const username = null;
const displayName = username ?? "Gast";
console.log(displayName);
const score = undefined;
const finalScore = score ?? 0;
console.log(finalScore);
const count = 0; // 0 ist ein gültiger Wert!
const result = count ?? 42;
console.log(result);Unterschied zu || (logisches ODER)
const volume = 0;
// || behandelt 0 als falsy → falscher Fallback!
const withOR = volume || 50;
console.log("mit ||:", withOR); // 50 – unerwünscht
// ?? behandelt 0 als gültigen Wert → korrekt!
const withNullish = volume ?? 50;
console.log("mit ??:", withNullish); // 0 – korrektKombination mit optionalem Verkettungsoperator (?.)
const user = {
profile: {
nickname: null
}
};
// Sicherer Zugriff auf tief verschachtelte Eigenschaften
const nickname = user?.profile?.nickname ?? "Anonym";
console.log(nickname);
// Nicht vorhandene Eigenschaft
const avatar = user?.profile?.avatarUrl ?? "default-avatar.png";
console.log(avatar);Nullish Assignment-Operator (??=) als Kurzform
// ??= weist den Wert nur zu, wenn die Variable null oder undefined ist
const settings = {
theme: null,
language: "de"
};
settings.theme ??= "light"; // wird gesetzt, war null
settings.language ??= "en"; // bleibt "de", war bereits gesetzt
console.log(settings.theme);
console.log(settings.language);// Wichtig · Fallstricke
Kombination mit || und &&: Das direkte Mischen von ?? mit || oder && ohne explizite Klammerung ist in JavaScript syntaktisch verboten und führt zu einem SyntaxError. Korrekte Lösung: Klammern setzen, z. B. (a || b) ?? c.
Browser-Kompatibilität: ?? ist seit ES2020 standardisiert und wird von allen modernen Browsern sowie Node.js ab Version 14 nativ unterstützt. Für ältere Umgebungen (z. B. IE11) ist ein Transpiler wie Babel notwendig.
Kein Ersatz für Typprüfungen: ?? prüft ausschließlich auf null und undefined. Werte wie NaN, false oder "" passieren den Operator unverändert. Wer diese Fälle ebenfalls abfangen möchte, muss weiterhin || oder eine explizite Prüfung verwenden.