1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
|
---
title: if...else
slug: Web/JavaScript/Reference/Statements/if...else
tags:
- JavaScript
- Statement
translation_of: Web/JavaScript/Reference/Statements/if...else
---
<div>{{jsSidebar("Statements")}}</div>
<p class="seoSummary">Die <strong>if-Anweisung</strong> führt Anweisungen aus, wenn eine bestimmte Bedingung zu <code>true</code> ausgewertet wird. Wird die Bedingung zu <code>false</code> ausgewertet, können andere Anweisungen ausgeführt werden.</p>
<div>{{EmbedInteractiveExample("pages/js/statement-ifelse.html")}}</div>
<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox">if (bedingung)<em> anweisung1</em> [else <em>anweisung2</em>]
</pre>
<dl>
<dt><code>bedingung</code></dt>
<dd>Ein <a href="/de/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions">Ausdruck</a>, der zu <code>true</code> oder <code>false</code> ausgewertet wird.</dd>
</dl>
<dl>
<dt><code>anweisung1</code></dt>
<dd>Eine Anweisung, die ausgeführt wird, wenn <code>bedingung</code> zu <code>true</code> ausgewertet wird. Diese Anweisung kann jede gültige Anweisung sein, auch eine if-Anweisung. Um mehrere Anweisungen auszuführen, muss eine {{jsxref("Statements/block", "block")}}-Anweisung (<code>{...}</code>) genutzt werden, um die Anweisungen zu gruppieren. Wenn keine Anweisung ausgeführt werden soll, muss die {{jsxref("Statements/empty", "empty")}}-Anweisung genutzt werden.</dd>
</dl>
<dl>
<dt><code>anweisung2</code></dt>
<dd>Eine Anweisung, die ausgeführt wird, wenn <code>bedingung</code> zu false ausgewertet wird und die <code>else</code> Klausel existiert. Auch hier können alle Anweisungen, egal ob {{jsxref("Statements/block", "block")}}-Anweisung (<code>{...}</code>) oder weitere if-Anweisungen genutzt werden.</dd>
</dl>
<h2 id="Description" name="Description">Beschreibung</h2>
<p>Mehrere <code>if...else</code>-Anweisungen können verschachtelt werden, wenn eine <code>else if</code>-Klausel erstellt wird. Zu beachten ist, dass es in JavaScript kein Schlüsselwort <code>elseif</code> (in einem Wort) gibt.</p>
<pre class="eval">if (<em>bedingung1</em>)
<em>anweisung1</em>
else if (<em>bedingung2</em>)
<em>anweisung2</em>
else if (<em>bedingung3</em>)
<em>anweisung3</em>
...
else
<em>anweisungN</em>
</pre>
<p>Um zu sehen wie das funktioniert, ist es hilfreich, die verschachtelten Anweisungen einzurücken:</p>
<pre class="eval">if (<em>bedingung1</em>)
<em>anweisung1</em>
else
if (<em>bedingung2</em>)
<em>anweisung2</em>
else
if (<em>bedingung3</em>)
...
</pre>
<p>Um mehrere Anweisungen in einer Klausel auszuführen, muss eine {{jsxref("Statements/block", "block")}}-Anweisung genutzt werden. Allgemein ist es immer gute Praxis (best practice) eine {{jsxref("Statements/block", "block")}}-Anweisung zu nutzen, besonders bei verschachtelten <code>if</code>-Anweisungen.</p>
<pre class="eval">if (<em>bedingung</em>) {
<em>anweisung1</em>
} else {
<em>anweisung2</em>
}
</pre>
<p>Man sollte den primitiven boolean-Datentyp nicht mit dem {{jsxref("Global_Objects/Boolean", "Boolean")}}-Objekt verwechseln. Jeder Wert, der nicht <code>undefined</code>, <code>null</code>, <code>0</code>, <code>NaN</code>, oder der leere string (<code>""</code>) ist, wird zu <code>true</code> ausgewertet. Dabei ist auch ein {{jsxref("Global_Objects/Boolean", "Boolean")}}-Objekt mit dem Wert false inbegriffen.</p>
<pre class="brush: js">var b = new Boolean(false);
if (b) // wird zu true ausgewertet
</pre>
<h2 id="Examples" name="Examples">Beispiele</h2>
<h3 id="Example:_Using_if...else" name="Example:_Using_if...else">Einsatz von <code>if...else</code></h3>
<pre class="brush: js">if (cipher_char === from_char) {
result = result + to_char;
x++;
} else {
result = result + clear_char;
}
</pre>
<h3 id="Einsatz_von_else_if">Einsatz von <code>else if</code></h3>
<p>Zu beachten ist, dass in JavaScript kein <code>elseif</code>-Schlüsselwort existiert. Man kann jedoch immer ein Leerzeichen zwischen <code>else</code> und <code>if</code> benutzen.</p>
<pre class="brush: js">if (x > 5) {
} else if (x > 50) {
} else {
}</pre>
<h3 id="Example:_Assignment_within_the_conditional_expression" name="Example:_Assignment_within_the_conditional_expression">Zuweisungen in der Bedingung</h3>
<p>Es ist nicht <span class="dpf_sent" id="dpfsent_1">ratsam </span>einfache Zuweisungen in die Bedingung zu schreiben, weil sie zu <span class="dpf_sent" id="dpfsent_1">Verwechselungen </span>mit dem Gleichheit-Operator führen kann. Zum Beispiel führt folgender Quelltext, der eine Zuweisung enthält immer zu 'true' und sollte daher so nicht benutzt werden:</p>
<pre class="brush: js example-bad">if (x = y) {
/* tu das richtige */
}
</pre>
<p>Wenn es nötig ist, eine Zuweisung in einer Bedingungs-Anweisunge zu benutzen, dann sollten Klammern um die Zuweisung gesetzt werden. Der Effekt ist jedoch derselbe, wie im vorangegangenen Code. Zum Beispiel:</p>
<pre class="brush: js example-good">if ((x = y)) {
/* tu das richtige */
}
</pre>
<h2 id="Spezifikationen">Spezifikationen</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spezifikation</th>
<th scope="col">Status</th>
<th scope="col">Kommentar</th>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-if-statement', 'if statement')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-if-statement', 'if statement')}}</td>
<td>{{Spec2('ES6')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-12.5', 'if statement')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES3', '#sec-12.5', 'if statement')}}</td>
<td>{{Spec2('ES3')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES1', '#sec-12.5', 'if statement')}}</td>
<td>{{Spec2('ES1')}}</td>
<td>Initiale Definition</td>
</tr>
</tbody>
</table>
<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
<p>{{Compat("javascript.statements.if_else")}}</p>
<h2 id="See_also" name="See_also">Siehe auch</h2>
<ul>
<li>{{jsxref("Statements/block", "block")}}</li>
<li>{{jsxref("Statements/switch", "switch")}}</li>
<li>{{jsxref("Operators/conditional_operator", "Bedingter (ternärer) Operator")}}</li>
</ul>
|