diff options
Diffstat (limited to 'files/zh-cn/web/javascript/reference/global_objects/array/entries')
| -rw-r--r-- | files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html | 154 |
1 files changed, 154 insertions, 0 deletions
diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html new file mode 100644 index 0000000000..6d2d0018a8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html @@ -0,0 +1,154 @@ +--- +title: Array.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Array/entries +tags: + - Array.prototype.entries() +translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries +--- +<div>{{JSRef}}</div> + +<p><code><strong>entries()</strong></code> 方法返回一个新的<strong>Array Iterator</strong>对象，该对象包含数组中每个索引的键/值对。</p> + +<p>{{EmbedInteractiveExample("pages/js/array-entries.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>arr</em>.entries()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("Array")}} 迭代器对象。<a href="http://www.ecma-international.org/ecma-262/6.0/#sec-createarrayiterator">Array Iterator</a>是对象，它的原型（__proto__:Array Iterator）上有一个<a href="http://www.ecma-international.org/ecma-262/6.0/#sec-%arrayiteratorprototype%.next">next</a>方法，可用用于遍历迭代器取得原数组的[key,value]。</p> + +<h2 id="示例">示例</h2> + +<h3 id="1、_Array_Iterator">1、 Array Iterator</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +console.log(iterator); + +/*<em>Array Iterator {}</em> + __proto__:Array Iterator + next:<em>ƒ next()</em> + Symbol(Symbol.toStringTag):"Array Iterator" + __proto__:<em>Object</em> +*/</pre> + +<h3 id="2、iterator.next()">2、iterator.next()</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +console.log(iterator.next()); + +/*{value: Array(2), done: false} + done:false + value:(2) [0, "a"] + __proto__: Object +*/ +// iterator.next()返回一个对象，对于有元素的数组， +// 是next{ value: Array(2), done: false }； +// next.done 用于指示迭代器是否完成：在每次迭代时进行更新而且都是false， +// 直到迭代器结束done才是true。 +// next.value是一个["key","value"]的数组，是返回的迭代器中的元素值。 +</pre> + +<h3 id="3、iterator.next方法运行">3、iterator.next方法运行</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iter = arr.entries(); +var a = []; + +// for(var i=0; i< arr.length; i++){ // 实际使用的是这个 +for(var i=0; i< arr.length+1; i++){ // 注意，是length+1，比数组的长度大 + var tem = iter.next(); // 每次迭代时更新next + console.log(tem.done); // 这里可以看到更新后的done都是false + if(tem.done !== true){ // 遍历迭代器结束done才是true + console.log(tem.value); + a[i]=tem.value; + } +} + +console.log(a); // 遍历完毕，输出next.value的数组</pre> + +<h3 id="4、二维数组按行排序">4、二维数组按行排序</h3> + +<pre class="brush: js">function sortArr(arr) { + var goNext = true; + var entries = arr.entries(); + while (goNext) { + var result = entries.next(); + if (result.done !== true) { + result.value[1].sort((a, b) => a - b); + goNext = true; + } else { + goNext = false; + } + } + return arr; +} + +var arr = [[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]; +sortArr(arr); + +/*(4) [Array(2), Array(5), Array(5), Array(4)] + 0:(2) [1, 34] + 1:(5) [2, 3, 44, 234, 456] + 2:(5) [1, 4, 5, 6, 4567] + 3:(4) [1, 23, 34, 78] + length:4 + __proto__:Array(0) +*/ +</pre> + +<h3 id="5、使用for…of_循环">5、使用<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for…of</a> 循环</h3> + +<pre class="brush:js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +// undefined + +for (let e of iterator) { + console.log(e); +} + +// [0, "a"] +// [1, "b"] +// [2, "c"] +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">规范状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.entries")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.keys()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li> +</ul> |