如果数组中某个元素满足测试条件,find() 方法就会返回那个元素的值,如果没有满足条件的元素,则返回 undefined。
区别:findIndex()方法返回的是满足条件的元素的索引,而非它的值。
语法
arr.find(callback[, thisArg])
参数
callback- 在数组每一项上执行的函数,接收 3 个参数:
element- 当前遍历到的元素。
index- 当前遍历到的索引。
array- 数组本身。
thisArg- 可选,指定
callback 的 this 参数。
描述
find方法对数组中的每一项元素执行一次callback 函数,直至有一个callback返回true。当找到了这样一个元素后,该方法会立即返回这个元素的值,否则返回undefined。注意callback函数只会在分配了值的数组索引上调用,而不会在已删除或未分配值的索引上调用。
调用callback函数带有3个参数:当前元素的值、当前元素的索引,以及数组本身。
如果提供了thisArg参数,那么它将作为每次callback函数执行时的上下文对象,否则上下文对象为undefined。
find方法不会改变数组。
在第一次调用callback函数时会确定元素的索引范围,因此在find方法开始执行之后添加到数组的新元素将不会被callback函数访问到。如果数组中一个尚未被callback函数访问到的元素的值被callback函数所改变,那么当callback函数访问到它时,它的值是将是根据它在数组中的索引所访问到的当前值。被删除的元素不会被访问到。
示例
用对象的属性查找数组里的对象
var inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
function findCherries(fruit) {
return fruit.name === 'cherries';
}
console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
寻找数组中的质数
下面的例子展示了如何从一个数组中寻找质数(如果找不到质数则返回undefined)
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].find(isPrime)); // undefined, not found
console.log([4, 5, 8, 12].find(isPrime)); // 5
Polyfill
本方法在ECMAScript 6规范中被加入,可能不存在于某些实现中。你可以通过以下代码来补充 Array.prototype.find。
if (!Array.prototype.find) {
Array.prototype.find = function(predicate) {
'use strict';
if (this == null) {
throw new TypeError('Array.prototype.find called on null or undefined');
}
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
var list = Object(this);
var length = list.length >>> 0;
var thisArg = arguments[1];
var value;
for (var i = 0; i < length; i++) {
value = list[i];
if (predicate.call(thisArg, value, i, list)) {
return value;
}
}
return undefined;
};
}
规范
| Specification | Status | Comment |
|---|---|---|
| ECMAScript 2015 (6th Edition, ECMA-262) Array.prototype.find |
Standard | Initial definition. |
| ECMAScript 2017 Draft (ECMA-262) Array.prototype.find |
Draft |
浏览器兼容性
| Feature | Chrome | Firefox (Gecko) | Edge | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 45.0 | 25.0 (25.0) | 12 | 未实现 | 7.1 |
| Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Edge | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | 未实现 | 未实现 | 25.0 (25.0) | 未实现 | 12 | 未实现 | 8.0 |