SyntaxError: cannot use ?? unparenthesized within || and && expressions

Nachricht

SyntaxError: Unexpected token '??' (V8-based)
SyntaxError: cannot use `??` unparenthesized within `||` and `&&` expressions (Firefox)
SyntaxError: Unexpected token '??'. Coalescing and logical operators used together in the same expression; parentheses must be used to disambiguate. (Safari)

Fehlertyp

Was ist schiefgelaufen?

Die Operatorpräzedenz-Reihenfolge sieht so aus:

|   >   &&   >   ||   >   =
|   >   ??   >   =

Allerdings ist die Präzedenz zwischen ?? und &&/|| absichtlich undefiniert, da das Short-Circuit-Verhalten von logischen Operatoren die Auswertung des Ausdrucks kontraintuitiv machen kann. Daher sind die folgenden Kombinationen alle Syntaxfehler, weil die Sprache nicht weiß, wie die Operanden geklammert werden sollen:

a ?? b || c;
a || b ?? c;
a ?? b && c;
a && b ?? c;

Stattdessen machen Sie Ihre Absicht deutlich, indem Sie entweder die eine oder andere Seite explizit klammern:

(a ?? b) || c;
a ?? (b && c);

Beispiele

Wenn Sie Legacy-Code migrieren, der || und && verwendet, um gegen null oder undefined abzusichern, können Sie ihn oft teilweise konvertieren:

function getId(user, fallback) {
  // Previously: user && user.id || fallback
  return user && user.id ?? fallback; // SyntaxError: cannot use `??` unparenthesized within `||` and `&&` expressions
}

Stattdessen sollten Sie das && klammern:

function getId(user, fallback) {
  return (user && user.id) ?? fallback;
}

Noch besser ist es, optionales Verketteln anstelle von && zu verwenden:

function getId(user, fallback) {
  return user?.id ?? fallback;
}

Siehe auch

• Problem über die Präzedenz des Nullish-Coalescing im TC39-Vorschlag zum Nullish-Coalescing
• Nullish coalescing operator (??)
• Operatorpräzedenz