if...else
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.
Die if...else
-Anweisung führt eine Anweisung aus, wenn eine bestimmte Bedingung truthy ist. Wenn die Bedingung falsy ist, wird eine andere Anweisung im optionalen else
-Abschnitt ausgeführt.
Probieren Sie es aus
function testNum(a) {
let result;
if (a > 0) {
result = "positive";
} else {
result = "NOT positive";
}
return result;
}
console.log(testNum(-5));
// Expected output: "NOT positive"
Syntax
if (condition)
statement1
// With an else clause
if (condition)
statement1
else
statement2
condition
statement1
-
Anweisung, die ausgeführt wird, wenn condition truthy ist. Kann jede Anweisung sein, einschließlich weiterer verschachtelter
if
-Anweisungen. Um mehrere Anweisungen auszuführen, verwenden Sie eine Block-Anweisung ({ /* ... */ }
), um diese Anweisungen zu gruppieren. Um keine Anweisungen auszuführen, nutzen Sie eine leere Anweisung. statement2
-
Anweisung, die ausgeführt wird, wenn
condition
falsy ist und derelse
-Abschnitt existiert. Kann jede Anweisung sein, einschließlich Blockanweisungen und weiterer verschachtelterif
-Anweisungen.
Beschreibung
Mehrere if...else
-Anweisungen können verschachtelt werden, um eine else if
-Klausel zu erstellen. Beachten Sie, dass es in JavaScript kein elseif
-Schlüsselwort (in einem Wort) gibt.
if (condition1)
statement1
else if (condition2)
statement2
else if (condition3)
statement3
// …
else
statementN
Um zu sehen, wie dies funktioniert, folgt hier die Darstellung mit ordnungsgemäßer Einrückung:
if (condition1)
statement1
else
if (condition2)
statement2
else
if (condition3)
statement3
// …
Um mehrere Anweisungen innerhalb einer Klausel auszuführen, verwenden Sie eine Blockanweisung ({ /* ... */ }
), um diese Anweisungen zu gruppieren.
if (condition) {
statements1
} else {
statements2
}
Das Auslassen von Blöcken kann zu verwirrendem Verhalten führen, insbesondere wenn der Code manuell formatiert wird. Zum Beispiel:
function checkValue(a, b) {
if (a === 1)
if (b === 2)
console.log("a is 1 and b is 2");
else
console.log("a is not 1");
}
Dieser Code sieht harmlos aus – jedoch wird bei der Ausführung von checkValue(1, 3)
die Meldung "a is not 1" ausgegeben. Dies liegt daran, dass im Fall eines dangling else der else
-Abschnitt mit der nächstgelegenen if
-Klausel verbunden wird. Der oben gezeigte Code würde bei ordnungsgemäßer Einrückung so aussehen:
function checkValue(a, b) {
if (a === 1)
if (b === 2)
console.log("a is 1 and b is 2");
else
console.log("a is not 1");
}
Im Allgemeinen ist es eine gute Praxis, immer Blockanweisungen zu verwenden, insbesondere bei Code mit verschachtelten if
-Anweisungen.
function checkValue(a, b) {
if (a === 1) {
if (b === 2) {
console.log("a is 1 and b is 2");
}
} else {
console.log("a is not 1");
}
}
Verwechseln Sie nicht die primitiven Boolean-Werte true
und false
mit der Truthiness oder Falsiness des Boolean
-Objekts. Jeder Wert, der nicht false
, undefined
, null
, 0
, -0
, NaN
oder der leere String (""
) ist und jedes Objekt, einschließlich eines Boolean-Objekts mit dem Wert false
, wird als truthy betrachtet, wenn es als Bedingung verwendet wird. Zum Beispiel:
const b = new Boolean(false);
if (b) {
console.log("b is truthy"); // "b is truthy"
}
Beispiele
Verwendung von if...else
if (cipherChar === fromChar) {
result += toChar;
x++;
} else {
result += clearChar;
}
Verwendung von else if
Beachten Sie, dass es keine elseif
-Syntax in JavaScript gibt. Sie können dies jedoch mit einem Leerzeichen zwischen else
und if
schreiben:
if (x > 50) {
/* do something */
} else if (x > 5) {
/* do something */
} else {
/* do something */
}
Verwendung einer Zuweisung als Bedingung
Sie sollten fast niemals eine if...else
-Anweisung mit einer Zuweisung wie x = y
als Bedingung verwenden:
if ((x = y)) {
// …
}
Denn im Gegensatz zu while
-Schleifen wird die Bedingung nur einmal ausgewertet, sodass die Zuweisung nur einmal erfolgt. Der obige Code ist gleichbedeutend mit:
x = y;
if (x) {
// …
}
Was viel klarer ist. Sollten Sie jedoch in dem seltenen Fall eine solche Situation haben wollen, finden Sie in der Dokumentation der while
-Schleife im Abschnitt Verwendung einer Zuweisung als Bedingung unsere Empfehlungen dazu.
Spezifikationen
Specification |
---|
ECMAScript® 2025 Language Specification # sec-if-statement |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | server | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
if...else |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support