aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html
blob: 6d2d0018a8de537650e2118d5e756bb5ff53f621 (plain)
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
---
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&lt; arr.length; i++){   // 实际使用的是这个
for(var i=0; i&lt; 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) =&gt; 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>