Logische ODER-Zuweisung (||=)

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

Probieren Sie es aus

Syntax

js
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 evaluiert wird.

Es wird keine Zuweisung vorgenommen, wenn die linke Seite nicht falsy ist, aufgrund des Short-Circuitings des logischen ODER Operators. Zum Beispiel verursacht das folgende keinen Fehler, obwohl x const ist:

js
const x = 1;
x ||= 2;

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

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

x.value ||= 2;

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

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

Beispiele

Standardinhalt festlegen

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

js
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ätzliche Parsing- oder Rendering-Arbeiten oder Verlust des Fokus verursacht werden.

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

Spezifikationen

Specification
ECMAScript Language Specification
# sec-assignment-operators

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch