aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/javascript/reference/statements/block/index.html
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:40:17 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:40:17 -0500
commit33058f2b292b3a581333bdfb21b8f671898c5060 (patch)
tree51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/web/javascript/reference/statements/block/index.html
parent8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff)
downloadtranslated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz
translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2
translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip
initial commit
Diffstat (limited to 'files/zh-cn/web/javascript/reference/statements/block/index.html')
-rw-r--r--files/zh-cn/web/javascript/reference/statements/block/index.html163
1 files changed, 163 insertions, 0 deletions
diff --git a/files/zh-cn/web/javascript/reference/statements/block/index.html b/files/zh-cn/web/javascript/reference/statements/block/index.html
new file mode 100644
index 0000000000..4188e5a2ec
--- /dev/null
+++ b/files/zh-cn/web/javascript/reference/statements/block/index.html
@@ -0,0 +1,163 @@
+---
+title: block
+slug: Web/JavaScript/Reference/Statements/block
+tags:
+ - JavaScript
+ - Reference
+ - Statement
+translation_of: Web/JavaScript/Reference/Statements/block
+---
+<div>
+<div>{{jsSidebar("Statements")}}</div>
+</div>
+
+<p><strong>块语句</strong>(或其他语言的<strong>复合语句</strong>)用于组合零个或多个语句。该块由一对大括号界定,可以是{{jsxref("Statements/label", "labelled")}}:</p>
+
+<h2 id="语法">语法</h2>
+
+<h3 id="块声明">块声明</h3>
+
+<pre class="syntaxbox">{ <em>StatementList </em>}
+</pre>
+
+<h3 id="标记块声明">标记块声明</h3>
+
+<pre class="syntaxbox"><em>LabelIdentifier</em>: { <em>StatementList </em>}
+</pre>
+
+<dl>
+ <dt><code>StatementList</code></dt>
+ <dd>在块语句中分组的语句。</dd>
+ <dt><code>LabelIdentifier</code></dt>
+ <dd>用于视觉识别的可选{{jsxref("Statements/label", "label")}}或{{jsxref("Statements/break", "break")}}的目标。</dd>
+</dl>
+
+<h2 id="描述">描述</h2>
+
+<p>其他语言中通常将语句块称为<strong>复合语句</strong>。它允许你使用多个语句,其中 JavaScript 只需要一个语句。将语句组合成块是 JavaScript 中的常见做法。相反的做法是可以使用一个<a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/Empty">空语句</a>,你不提供任何语句,虽然一个是必需的。</p>
+
+<h3 id="块级作用域">块级作用域</h3>
+
+<h4 id="在非严格模式non-strict_mode下的var_或者函数声明时">在非严格模式(non-strict mode)下的<code>var </code>或者函数声明时</h4>
+
+<p>通过<code>var</code>声明的变量或者非严格模式下(non-strict mode)创建的函数声明<strong>没有</strong>块级作用域。在语句块里声明的变量的作用域不仅是其所在的函数或者 script 标签内,所设置变量的影响会在超出语句块本身之外持续存在。 换句话说,这种语句块不会引入一个作用域。尽管单独的语句块是合法的语句,但在JavaScript中你不会想使用单独的语句块,因为它们不像你想象的C或Java中的语句块那样处理事物。例如:</p>
+
+<pre class="brush: js example-bad">var x = 1;
+{
+ var x = 2;
+}
+console.log(x); // 输出 2
+</pre>
+
+<p>输出结果是 2,因为块中的 <code>var x</code>语句与块前面的<code>var x</code>语句作用域相同。在 C 或 Java中,这段代码会输出 1。</p>
+
+
+
+<h4 id="使用let和_const">使用<code>let</code>和 <code>const</code></h4>
+
+<p>相比之下,使用 {{jsxref("Statements/let", "let")}}和{{jsxref("Statements/const", "const")}}声明的变量是<strong>有</strong>块级作用域的。</p>
+
+<pre class="brush: js">let x = 1;
+{
+ let x = 2;
+}
+console.log(x); // 输出 1</pre>
+
+<p><code>x = 2</code>仅限在定义它的块中。</p>
+
+<p><code>const</code>的结果也是一样的:</p>
+
+<pre class="brush: js">const c = 1;
+{
+ const c = 2;
+}
+console.log(c); // 输出1, 而且不会报错</pre>
+
+<p>注意,位于块范围之内的 <code>const c = 2</code> 并不会抛出<code>SyntaxError: Identifier 'c' has already been declared</code>这样的语法错误,因为在它自己的块中它可能是唯一一个被声明的常量。</p>
+
+<h5 id="使用let声明的变量在块级作用域内能强制执行更新变量,下面的两个例子对比:">使用let声明的变量在块级作用域内能强制执行更新变量,下面的两个例子对比:</h5>
+
+<pre class="brush: js">var a = [];
+for (<strong>var</strong> i = 0; i &lt; 10; i++) {
+ a[i] = function () {console.log(i);};
+}
+a[0](); // 10
+a[1](); // 10
+a[6](); // 10
+
+/********************/
+
+var a = [];
+for (<strong>let</strong> i = 0; i &lt; 10; i++) {
+ a[i] = function () {console.log(i);};
+}
+a[0](); // 0
+a[1](); // 1
+a[6](); // 6</pre>
+
+<h4 id="使用function">使用<code>function</code></h4>
+
+<p><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function">函数声明</a>同样被限制在声明他的语句块内:</p>
+
+
+
+<pre><code>foo('outside'); // TypeError: foo is not a function
+{
+ function foo(location) {
+ console.log('foo is called ' + location);
+ }
+ foo('inside'); // 正常工作并且打印 'foo is called inside'
+}</code></pre>
+
+
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</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>Initial definition. Implemented in JavaScript 1.0.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容">浏览器兼容</h2>
+
+<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("javascript.statements.block")}}</p>
+
+<h2 id="See_also" name="See_also">相关链接</h2>
+
+<ul>
+ <li>{{jsxref("Statements/while", "while")}}</li>
+ <li>{{jsxref("Statements/if...else", "if...else")}}</li>
+ <li>{{jsxref("Statements/let", "let")}}</li>
+</ul>