Logische Oder-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 logische Oder-Zuweisungsoperator (||=) wertet nur den rechten Operanden aus und weist den 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 logische Oder-Zuweisung short-circuits, was bedeutet, dass x ||= y äquivalent zu x || (x = y) ist, außer dass der Ausdruck x nur einmal ausgewertet wird.

Es wird keine Zuweisung vorgenommen, wenn der linke Ausdruck nicht falsy ist, aufgrund des Short-Circuiting des logischen Oder-Operators. Zum Beispiel wird das Folgende keinen Fehler auslösen, obwohl x eine const ist:

const x = 1;
x ||= 2;

Auch das Folgende würde den Setter nicht auslösen:

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

x.value ||= 2;

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

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

Beispiele

Standardinhalt festlegen

Wenn das Element "lyrics" 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 Nebenwirkungen wie zusätzliches Parsing oder Rendering oder Verlust des Fokus verursacht.

Hinweis: Achten Sie auf den Wert, der von der API zurückgegeben wird, die Sie überprüfen. Wenn ein leerer String zurückgegeben wird (ein falsy Wert), muss ||= verwendet werden, damit "Keine Lyrics." anstelle eines Leerzeichens angezeigt wird. Wenn die API jedoch null oder undefined bei leerem Inhalt zurückgibt, sollte stattdessen ??= verwendet werden.

Spezifikationen

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