initial commit

1 files changed, 126 insertions, 0 deletions

diff --git a/files/zh-cn/web/javascript/reference/errors/is_not_iterable/index.html b/files/zh-cn/web/javascript/reference/errors/is_not_iterable/index.html
new file mode 100644
index 0000000000..a3cd34eb82
--- /dev/null
+++ b/files/zh-cn/web/javascript/reference/errors/is_not_iterable/index.html
@@ -0,0 +1,126 @@
+---
+title: 'TypeError: ''x'' is not iterable'
+slug: Web/JavaScript/Reference/Errors/is_not_iterable
+tags:
+  - 生成器
+  - 迭代器
+translation_of: Web/JavaScript/Reference/Errors/is_not_iterable
+---
+<div>{{jsSidebar("Errors")}}</div>
+
+<h2 id="错误信息">错误信息</h2>
+
+<pre class="syntaxbox">TypeError: 'x' is not iterable (Firefox, Chrome)
+TypeError: 'x' is not a function or its return value is not iterable (Chrome)
+</pre>
+
+<h2 id="错误类型">错误类型</h2>
+
+<p>{{jsxref("TypeError")}}</p>
+
+<h2 id="发生了什么错误">发生了什么错误?</h2>
+
+<p>这个值作为 <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement">for…of  </a>的表达式右值，或者作为一个函数的参数，如 {{jsxref("Promise.all")}} 或者 {{jsxref("TypedArray.from")}}, 不是一个 <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">可迭代对象</a>.  一个可迭代对象可以是一个内置可迭代类型，如{{jsxref("Array")}}, {{jsxref("String")}} 或 {{jsxref("Map")}}, 一个 generator 生成结果, 或者一个实现了 <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">可迭代协议</a> 的对象</p>
+
+<h2 id="示例">示例</h2>
+
+<h3 id="Iterating_over_Object_properties">Iterating over Object properties</h3>
+
+<p>在JavaScript中, {{jsxref("Object")}} 是不可迭代的，除非它们实现了<a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">迭代协议</a>. 因此, 你不能使用 <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement">for…of </a>来迭代对象的属性.</p>
+
+<pre class="brush: js example-bad">var obj = { 'France': 'Paris', 'England': 'London' };
+for (let p of obj) { // TypeError: obj is not iterable
+    // …
+}
+</pre>
+
+<p>做为替代你必须使用 {{jsxref("Object.keys")}} 或 {{jsxref("Object.entries")}} 来迭代对象的属性或属性值.</p>
+
+<pre class="brush: js example-good">var obj = { 'France': 'Paris', 'England': 'London' };
+// 迭代属性名称:
+for (let country of <code>Object</code>.keys(obj)) {
+    var capital = obj[country];
+    console.log(country, capital);
+}
+
+for (const [country, capital] of <code>Object</code>.entries(obj))
+    console.log(country, capital);
+</pre>
+
+<p>这次case的另外一个选择是使用 {{jsxref("Map")}}:</p>
+
+<pre class="brush: js example-good">var map = new Map;
+map.set('France', 'Paris');
+map.set('England', 'London');
+// Iterate over the property names:
+for (let country of map.keys()) {
+    let capital = map[country];
+    console.log(country, capital);
+}
+
+for (let capital of map.values())
+    console.log(capital);
+
+for (const [country, capital] of map.entries())
+    console.log(country, capital);
+</pre>
+
+<h3 id="Iterating_over_a_generator">Iterating over a generator</h3>
+
+<p><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generators">Generators</a> 是用来生成可迭代对象的函数.</p>
+
+<pre class="brush: js example-bad">function* generate(a, b) {
+  yield a;
+  yield b;
+}
+
+for (let x of generate) // TypeError: generate is not iterable
+    console.log(x);
+</pre>
+
+<p>当它没有被调用, 这个 {{jsxref("Function")}} 相应的是可调用的，但是不可迭代。 调用 generator 生成一个可迭代对象，该对象将迭代在生成器执行期间生成的值.</p>
+
+<pre class="brush: js example-good">function* generate(a, b) {
+    yield a;
+    yield b;
+}
+
+for (let x of generate(1,2))
+    console.log(x);</pre>
+
+<h3 id="Iterating_over_a_custom_iterable">Iterating over a custom iterable</h3>
+
+<p>可以使用{{jsxref("Symbol.iterator")}} 方法去实现一个自定义迭代器。你必须确定自定义的迭代器方法返回一个迭代器对象，即它必须有一个next()</p>
+
+<pre class="brush: js example-bad">const myEmptyIterable = {
+    [Symbol.iterator]() {
+        return [] // [] is iterable, but it is not an iterator -- it has no next method.
+    }
+}
+
+Array.from(myEmptyIterable);  // TypeError: myEmptyIterable is not iterable
+</pre>
+
+<pre></pre>
+
+<p>下面是正确用法</p>
+
+<pre class="brush: js example-good">const myEmptyIterable = {
+    [Symbol.iterator]() {
+        return [][Symbol.iterator]()
+    }
+}
+
+Array.from(myEmptyIterable);  // []
+</pre>
+
+<h2 id="参阅">参阅</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">iterable protocol</a></li>
+ <li>{{jsxref("Object.keys")}}</li>
+ <li>{{jsxref("Object.entries")}}</li>
+ <li>{{jsxref("Map")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generators">generators</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement">for…of</a></li>
+</ul>