Conditional (ternary) operator

Baseline Widely available

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

Der bedingte (ternäre) Operator ist der einzige JavaScript-Operator, der drei Operanden benötigt: eine Bedingung, gefolgt von einem Fragezeichen (?), dann einem Ausdruck, der ausgeführt wird, wenn die Bedingung wahrhaftig ist, gefolgt von einem Doppelpunkt (:), und schließlich der Ausdruck, der ausgeführt wird, wenn die Bedingung falsch ist. Dieser Operator wird häufig als Alternative zu einer if...else-Anweisung verwendet.

Probieren Sie es aus

Syntax

js
condition ? exprIfTrue : exprIfFalse

Parameter

condition

Ein Ausdruck, dessen Wert als Bedingung verwendet wird.

exprIfTrue

Ein Ausdruck, der ausgeführt wird, wenn condition zu einem wahrhaftigen Wert evaluiert (einem, der gleich true ist oder zu true konvertiert werden kann).

exprIfFalse

Ein Ausdruck, der ausgeführt wird, wenn condition falsch ist (das heißt, einen Wert hat, der zu false konvertiert werden kann).

Beschreibung

Neben false sind mögliche falsche Ausdrücke: null, NaN, 0, der leere String ("") und undefined. Wenn condition einer dieser Werte ist, wird das Ergebnis des bedingten Ausdrucks das Ergebnis der Ausführung des Ausdrucks exprIfFalse sein.

Beispiele

Ein einfaches Beispiel

js
const age = 26;
const beverage = age >= 21 ? "Beer" : "Juice";
console.log(beverage); // "Beer"

Umgang mit null-Werten

Eine häufige Anwendung ist der Umgang mit einem Wert, der möglicherweise null ist:

js
const greeting = (person) => {
  const name = person ? person.name : "stranger";
  return `Howdy, ${name}`;
};

console.log(greeting({ name: "Alice" })); // "Howdy, Alice"
console.log(greeting(null)); // "Howdy, stranger"

Bedingte Verkettungen

Der ternäre Operator ist rechtsassoziativ, was bedeutet, dass er in der folgenden Weise "verkettet" werden kann, ähnlich einer if … else if … else if … else-Kette:

js
function example() {
  return condition1 ? value1
    : condition2 ? value2
    : condition3 ? value3
    : value4;
}

Dies ist äquivalent zur folgenden if...else-Kette.

js
function example() {
  if (condition1) {
    return value1;
  } else if (condition2) {
    return value2;
  } else if (condition3) {
    return value3;
  } else {
    return value4;
  }
}

Spezifikationen

Specification
ECMAScript Language Specification
# sec-conditional-operator

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch