Logical OR Zuweisung (||=)

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.

Der Logical OR Zuweisungsoperator (||=) wertet nur den rechten Operanden aus und weist ihn dem linken zu, wenn der linke Operand falsy ist.

Probieren Sie es aus

const a = { duration: 50, title: "" };

a.duration ||= 10;
console.log(a.duration);
// Expected output: 50

a.title ||= "title is empty.";
console.log(a.title);
// Expected output: "title is empty."

Syntax

x ||= y

Beschreibung

Die Logical OR Zuweisung short-circuiting, was bedeutet, dass x ||= y gleichbedeutend mit x || (x = y) ist, außer dass der Ausdruck x nur einmal ausgewertet wird.

Es erfolgt keine Zuweisung, wenn die linke Seite nicht falsy ist, aufgrund des Short-Circuitings des Logical OR Operators. Zum Beispiel wirft das folgende keinen Fehler, obwohl x eine const ist:

const x = 1;
x ||= 2;

Ebenso würde das folgende nicht den Setter auslösen:

const x = {
  get value() {
    return 1;
  },
  set value(v) {
    console.log("Setter called");
  },
};

x.value ||= 2;

Tatsächlich wird, wenn x nicht falsy ist, y überhaupt nicht ausgewertet.

const x = 1;
x ||= console.log("y evaluated");
// Logs nothing

Beispiele

Standardinhalt festlegen

Wenn das "lyrics"-Element leer ist, wird ein Standardwert angezeigt:

document.getElementById("lyrics").textContent ||= "No lyrics.";

Hier ist das Short-Circuiting besonders vorteilhaft, da das Element nicht unnötig aktualisiert wird und keine unerwünschten Nebeneffekte wie zusätzlicher Parsing- oder Rendering-Aufwand oder Verlust des Fokus verursacht werden.

Hinweis: Achten Sie auf den Wert, den die API zurückliefert, gegen die Sie prüfen. Wenn eine leere Zeichenfolge zurückgegeben wird (ein falsy Wert), muss ||= verwendet werden, damit "Keine Lyrics." angezeigt wird, anstatt eines leeren Raums. Wenn die API jedoch null oder undefined im Fall von leerem Inhalt zurückgibt, sollte stattdessen ??= verwendet werden.

Spezifikationen

Specification
ECMAScript® 2026 Language Specification # sec-assignment-operators