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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
|
---
title: Array.prototype.findIndex()
slug: Web/JavaScript/Reference/Global_Objects/Array/findIndex
translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex
---
<div>{{JSRef}}</div>
<p>Phương thức <code><strong>findIndex()</strong></code> trả về <strong>chỉ số (index)</strong> của phần tử đầu tiên trong mảng thỏa mãn hàm truyền vào. Nếu không phần tử nào thỏa mãn, phương thức trả lại -1.</p>
<pre class="brush: js">function isBigEnough(element) {
return element >= 15;
}
[12, 5, 8, 130, 44].findIndex(isBigEnough); // Trả về 3, phần tử thứ 4.</pre>
<p>Xem thêm phương thức {{jsxref("Array.find", "find()")}}, trả về <strong>giá trị (value)</strong> của phần tử được tìm thấy thay vì chỉ số.</p>
<h2 id="Cú_pháp">Cú pháp</h2>
<pre class="syntaxbox"><var>arr</var>.findIndex(<var>callback</var>[, <var>thisArg</var>])</pre>
<h3 id="Tham_số">Tham số</h3>
<dl>
<dt><code>callback</code></dt>
<dd>Hàm kiểm tra, được thực thi cho mỗi phần tử của mảng, có thể chứa 3 tham số:
<dl>
<dt><code>element</code></dt>
<dd>Phần tử đang xét.</dd>
<dt><code>index</code></dt>
<dd>Chỉ số của phần tử đang xét.</dd>
<dt><code>array</code></dt>
<dd>Mảng được gọi.</dd>
</dl>
</dd>
<dt><code>thisArg</code></dt>
<dd>Optional. Object to use as <code>this</code> when executing <code>callback</code>.</dd>
</dl>
<h3 id="Giá_trị_trả_về">Giá trị trả về</h3>
<p>Một chỉ số của mảng nếu tìm được phần tử đầu tiên thỏa mãn hàm kiểm tra; otherwise, <strong>-1</strong>.</p>
<h2 id="Mô_tả">Mô tả</h2>
<p>Phương thức <code>findIndex</code> thực thi hàm <code>callback</code> từng lần cho toàn bộ chỉ số mảng từ <code>0..length-1</code> (bao gồm hai nút) trong mảng cho tới khi tìm thấy chỉ số mà phần tử tại đó làm cho <code>callback</code> trả về một giá trị đúng (a value that coerces to <code>true</code>). Nếu một phần tử được tìm thấy, <code>findIndex</code> lập tức trả về chỉ số của phần tử này. Nếu hàm callback luôn nhận giá trị không đúng hoặc số phần tử của mảng bằng 0, <code>findIndex</code> trả về -1. Không giống như cách phương thức về mảng khác như Array#some, trong mảng thưa thớt hàm <code>callback</code> được gọi là ngay cả đối với các chỉ mục của mục không có trong mảng đó.</p>
<p><code>callback</code> được gọi với 3 đối số: giá trị của phần tử, chỉ số của phần tử, và mảng đang được xét.</p>
<p>Nếu tham số <code>thisArg</code> được đưa vào <code>findIndex</code>, Nó sẽ được sử dụng như là <code>this</code> cho mỗi lần gọi <code>callback</code>. Nếu nó không được đưa vào, thì {{jsxref("undefined")}} sẽ được sử dụng.</p>
<p><code>findIndex</code> không làm thay đổi mảng mà nó được gọi.</p>
<p>The range of elements processed by <code>findIndex</code> is set before the first invocation of <code>callback</code>. Elements that are appended to the array after the call to <code>findIndex</code> begins will not be visited by <code>callback</code>. If an existing, unvisited element of the array is changed by <code>callback</code>, its value passed to the visiting <code>callback</code> will be the value at the time that <code>findIndex</code> visits that element's index; elements that are deleted are not visited.</p>
<h2 id="Ví_dụ">Ví dụ</h2>
<h3 id="Tìm_chỉ_số_của_một_số_nguyên_tố_trong_mảng">Tìm chỉ số của một số nguyên tố trong mảng</h3>
<p>Ví dụ dưới đây tìm chỉ số của một phần tử trong mảng mà là số nguyên tố (trả về -1 nếu không tìm thấy).</p>
<pre class="brush: js">function isPrime(element, index, array) {
var start = 2;
while (start <= Math.sqrt(element)) {
if (element % start++ < 1) {
return false;
}
}
return element > 1;
}
console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, not found
console.log([4, 6, 7, 12].findIndex(isPrime)); // 2
</pre>
<h2 id="Polyfill">Polyfill</h2>
<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.findIndex
if (!Array.prototype.findIndex) {
Object.defineProperty(Array.prototype, 'findIndex', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
var thisArg = arguments[1];
// 5. Let k be 0.
var k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return k.
var kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return k;
}
// e. Increase k by 1.
k++;
}
// 7. Return -1.
return -1;
}
});
}
</pre>
<p>If you need to support truly obsolete JavaScript engines that don't support <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, it's best not to polyfill <code>Array.prototype</code> methods at all, as you can't make them non-enumerable.</p>
<h2 id="Các_thông_số">Các thông số</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('ES2015', '#sec-array.prototype.findindex', 'Array.prototype.findIndex')}}</td>
<td>{{Spec2('ES2015')}}</td>
<td>Initial definition.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-array.prototype.findIndex', 'Array.prototype.findIndex')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Tương_thích_trình_duyệt">Tương thích trình duyệt</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Edge</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatChrome(45.0)}}</td>
<td>{{CompatGeckoDesktop("25.0")}}</td>
<td>{{CompatNo}}</td>
<td>Yes</td>
<td>Yes</td>
<td>{{CompatSafari("7.1")}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatGeckoMobile("25.0")}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>8.0</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Xem_thêm">Xem thêm</h2>
<ul>
<li>{{jsxref("Array.prototype.find()")}}</li>
<li>{{jsxref("Array.prototype.indexOf()")}}</li>
</ul>
|