此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
Array.prototype.find()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年9月.
find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回undefined。
- 如果需要在数组中找到对应元素的索引,请使用
findIndex()。 - 如果需要查找某个值的索引,请使用
Array.prototype.indexOf()。(它类似于findIndex(),但只是检查每个元素是否与值相等,而不是使用测试函数。) - 如果需要查找数组中是否存在某个值,请使用
Array.prototype.includes()。同样,它检查每个元素是否与值相等,而不是使用测试函数。 - 如果需要查找是否有元素满足所提供的测试函数,请使用
Array.prototype.some()。
In this article
尝试一下
const array1 = [5, 12, 8, 130, 44];const found = array1.find((element) => element > 10);console.log(found);// Expected output: 12语法
find(callbackFn)find(callbackFn, thisArg)参数
返回值
数组中第一个满足所提供测试函数的元素的值,否则返回undefined。
描述
find() 方法是一个迭代方法。它按索引升序顺序为数组中的每个元素调用提供的callbackFn 函数,直到callbackFn 返回一个真值。然后find() 返回该元素并停止迭代数组。如果callbackFn 从未返回真值,则find() 返回undefined。
callbackFn 被调用来处理数组的每一个索引,而不仅仅是那些有值的索引。在稀疏数组中,未赋值的空槽与undefined 表现相同。
find() 不会改变被调用的数组,但是提供给callbackFn 的函数可能会改变它。但需要注意的是,在第一次调用callbackFn之前,数组的长度会被保存。因此:
- 当调用
find()时,callbackFn不会访问超出数组初始长度的任何元素。 - 对已经访问过的索引的更改不会导致再次在这些元素上调用
callbackFn。 - 如果
callbackFn改变了数组中已存在但尚未被访问的元素,则传递给callbackFn的该元素的值将是该元素在被访问时的值。被删除的元素被视为undefined。
警告:上述类型的并发修改经常导致难以理解的代码,通常应避免(特殊情况除外)。
find() 方法是通用的。它只期望this 值具有length 属性和整数键属性。
示例
>在对象数组中通过对象属性进行查找
const inventory = [ { name: "apples", quantity: 2 }, { name: "bananas", quantity: 0 }, { name: "cherries", quantity: 5 },];function isCherries(fruit) { return fruit.name === "cherries";}console.log(inventory.find(isCherries));// { name: 'cherries', quantity: 5 }使用箭头函数和解构
const inventory = [ { name: "apples", quantity: 2 }, { name: "bananas", quantity: 0 }, { name: "cherries", quantity: 5 },];const result = inventory.find(({ name }) => name === "cherries");console.log(result); // { name: 'cherries', quantity: 5 }寻找数组中的第一个素数
下面的例子展示了如何从数组中寻找素数(如果找不到素数则返回undefined):
function isPrime(n) { if (n < 2) { return false; } if (n % 2 === 0) { return n === 2; } for (let factor = 3; factor * factor <= n; factor += 2) { if (n % factor === 0) { return false; } } return true;}console.log([4, 6, 8, 12].find(isPrime)); // undefined,未找到console.log([4, 5, 8, 12].find(isPrime)); // 5备注:isPrime() 实现仅供演示。在实际应用中,为了避免重复计算,会使用大量记忆化的算法,例如埃拉托斯特尼筛法。
在稀疏数组上使用 find()
在稀疏数组中,空槽会被访问的,并被视为undefined。
// 声明一个在索引 2、3 和 4 处没有元素的数组const array = [0, 1, , , , 5, 6];// 将会打印所有索引,而不仅仅是那些有值的非空槽array.find((value, index) => { console.log(`访问索引 ${index},值为 ${value}`);});// 访问索引 0,值为 0// 访问索引 1,值为 1// 访问索引 2,值为 undefined// 访问索引 3,值为 undefined// 访问索引 4,值为 undefined// 访问索引 5,值为 5// 访问索引 6,值为 6// 打印所有索引,包括已删除的array.find((value, index) => { // 在第一次迭代时删除元素 5 if (index === 0) { console.log(`删除 array[5] 的值 ${array[5]}`); delete array[5]; } // 即使删除了,元素 5 仍然被访问 console.log(`访问索引 ${index},值为 ${value}`);});// 删除值为 5 的 array[5]// 访问索引 0,值为 0// 访问索引 1,值为 1// 访问索引 2,值为 undefined// 访问索引 3,值为 undefined// 访问索引 4,值为 undefined// 访问索引 5,值为 undefined// 访问索引 6,值为 6在非数组对象上调用 find()
find() 方法读取this 的length 属性,然后访问每个整数索引。
const arrayLike = { length: 3, 0: 2, 1: 7.3, 2: 4,};console.log(Array.prototype.find.call(arrayLike, (x) => !Number.isInteger(x)));// 7.3规范
| Specification |
|---|
| ECMAScript® 2026 Language Specification> # sec-array.prototype.find> |