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
|
---
title: block
slug: Web/JavaScript/Reference/Statements/block
tags:
- Anweisung
- JavaScript
- Statement
translation_of: Web/JavaScript/Reference/Statements/block
---
<p>{{jsSidebar("Statements")}}</p>
<p>Eine <strong>Blockanweisung</strong> (oder in anderen Sprachen <strong>Verbundanweisung</strong>) wird genutzt, um Anweisungen zu gruppieren. Ein Block wird durch ein Paar geschweifte Klammern abgegrenzt. Optional kann ihm ein {{jsxref("Statements/label", "Label")}} zugewiesen werden.</p>
<p>{{EmbedInteractiveExample("pages/js/statement-block.html", "taller")}}</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">[label:] {
anweisung_1;
anweisung_2;
...
anweisung_n;
}
</pre>
<dl>
<dt><code>anweisung1</code>, <code>anweisung2</code>, <code>anweisungN</code></dt>
<dd>Anweisungen, die zu einer Blockanweisung gruppiert werden.</dd>
<dt><code>label</code></dt>
<dd>Ein optionales {{jsxref("Statements/label", "Label")}}, entweder nur als Kennzeichnung oder als Referenz für die Verwendung in einer {{jsxref("Statements/break", "break")}}-Anweisung.</dd>
</dl>
<h2 id="Beschreibung">Beschreibung</h2>
<p>Eine Blockanweisung wird meistens in Verbindung mit Komtrollfluss-Anweisungen (z. B. {{jsxref("Statements/if...else", "if…else")}}, {{jsxref("Statements/for", "for")}}, {{jsxref("Statements/while", "while")}}) genutzt. Zum Beispiel:</p>
<pre class="brush: js">while (x < 10) {
x++;
}
</pre>
<p>Zu beachten ist, dass eine Blockanweisung nicht mit einem Semikolon endet.</p>
<p>In anderen Sprachen wird eine Blockanweisung auch oftmals Verbundanweisung genannt. Dieser erlaubt den Einsatz mehrerer Anweisungen an Stellen, an denen JavaScript nur eine Anweisung erwartet. Das Kombinieren von Anweisungen in Blöcken ist in Javascript gängige Praxis. Mit einer {{jsxref("Statements/empty", "empty")}}-Anweisung ist auch der gegenteilige Fall umsetzbar (keine Anweisung an Stellen, an denen Anweisungen erwartet werden).</p>
<h3 id="Variablen_in_Blockgültigkeitsbereichen">Variablen in Blockgültigkeitsbereichen</h3>
<p><strong>Wichtig</strong>: Variablen, die mit {{jsxref("Statements/var", "var")}} deklariert werden, haben keinen Blockgültigkeitsbereich. Sie sind an den Gültigkeitsbereich der umschließenden Funktion oder des Skripts gebunden. Variablen sind folglich auch <span class="dpf_sent" id="dpfsent_4">außerhalb </span>des Blocks verfügbar, in dem sie deklariert wurden. Beispiel:</p>
<pre class="brush: js example-bad">var x = 1;
{
var x = 2;
}
console.log(x); // Ausgabe: 2
</pre>
<p>Die Ausgabe zeigt <em>2</em>, weil die Anweisungen <code>var x</code> <span class="dpf_sent" id="dpfsent_4">außerhalb </span>des Blocks und innerhalb des Blocks den gleichen Gültigkeitsbereich haben. In anderen Sprachen würde dieser Code <em>1</em> ausgeben.</p>
<p>Um die Gültigkeit auf den Block zu begrenzen, muss {{jsxref("Statements/let", "let")}} eingesetzt werden:</p>
<pre class="brush: js">let x = 1;
{
let x = 2; // dieses x ist nur in diesem Block sichtbar
}
console.log(x); // Ausgabe: 1
</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-block', 'Block statement')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-block', 'Block statement')}}</td>
<td>{{Spec2('ES6')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-12.1', 'Block statement')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES3', '#sec-12.1', 'Block statement')}}</td>
<td>{{Spec2('ES3')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES1', '#sec-12.1', 'Block statement')}}</td>
<td>{{Spec2('ES1')}}</td>
<td>Erste Definition. Implementiert in JavaScript 1.0.</td>
</tr>
</tbody>
</table>
<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
<p>{{Compat("javascript.statements.block")}}</p>
<h2 id="Siehe_auch">Siehe auch</h2>
<ul>
<li>{{jsxref("Statements/while", "while")}}</li>
<li>{{jsxref("Statements/if", "if")}}</li>
<li>{{jsxref("Statements/let", "let")}}</li>
</ul>
|