在 ES6 中使用 Array.prototype.find 和 Array.prototype.findIndex 进行数组遍历和操作-JavaScript中文网-JavaScript教程资源分享门户

在 JavaScript 中，数组是一种常用的数据结构。在 ES6 中，新增了 Array.prototype.find 和 Array.prototype.findIndex 这两个方法，可以方便地进行数组遍历和操作。本文将详细介绍这两个方法的使用，包括语法、参数、返回值等，同时也会提供一些示例代码，以便读者更好地理解和应用。

Array.prototype.find

Array.prototype.find 方法用于查找数组中第一个满足条件的元素。其语法如下：

array.find(callback[, thisArg])

其中，callback 是一个用来测试每个元素的函数，它接受三个参数：

element：当前元素；
index：当前元素的索引；
array：当前数组。

thisArg 是可选的参数，用于指定 callback 函数中 this 的值。

find 方法返回第一个满足条件的元素，如果没有找到则返回 undefined。

下面是一个示例代码：

const array = [1, 2, 3, 4, 5];
const result = array.find(element => element > 3);
console.log(result); // 4

在上面的代码中，我们定义了一个数组 array，然后使用 find 方法查找第一个大于 3 的元素，最后将结果打印出来。由于数组中有 4 这个元素，因此输出结果为 4。

Array.prototype.findIndex

Array.prototype.findIndex 方法与 Array.prototype.find 方法类似，不同之处在于它返回的是第一个满足条件的元素的索引，而不是元素本身。其语法如下：

array.findIndex(callback[, thisArg])

其中，callback 的参数和返回值与 find 方法相同。

findIndex 方法返回第一个满足条件的元素的索引，如果没有找到则返回 -1。

下面是一个示例代码：

const array = [1, 2, 3, 4, 5];
const index = array.findIndex(element => element > 3);
console.log(index); // 3

在上面的代码中，我们定义了一个数组 array，然后使用 findIndex 方法查找第一个大于 3 的元素的索引，最后将结果打印出来。由于数组中第一个大于 3 的元素是 4，其索引为 3，因此输出结果为 3。

总结

在 ES6 中，Array.prototype.find 和 Array.prototype.findIndex 这两个方法为我们提供了方便的数组遍历和操作功能。它们的语法简单明了，使用起来也非常方便。在实际开发中，我们可以根据具体的需求来选择使用哪一个方法，以便更好地完成数组操作。

参考链接

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/65561011d2f5e1655d086f5e