ES8 中使用 Array.prototype.findIndex() 查找数组元素的索引方式详解

Array.prototype.findIndex() 是 ES8 新增的一个数组方法，用于查找数组中符合条件的元素并返回其在数组中的索引值。本文将详细介绍如何使用该方法及其相关注意事项。

方法说明

Array.prototype.findIndex(callback[, thisArg]) 方法接受一个回调函数作为参数，该回调函数会遍历整个数组，当某个元素通过该函数返回 true 时，该元素在数组中的索引值将被返回。如果没有符合条件的元素，则返回 -1。

callback 回调函数接受三个参数：

1. element：表示当前被遍历的元素。
2. index：表示 element 在当前数组中的索引值。
3. array：表示完整数组。

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

示例代码

下面是演示如何使用 Array.prototype.findIndex() 的代码示例：

const fruits = ['apple', 'banana', 'orange', 'mango'];
const index = fruits.findIndex(fruit => fruit === 'banana');
console.log(index); // 输出 1

上述代码查找数组 fruits 中是否包含元素 'banana'，结果返回其索引值 1。

注意事项

1. Array.prototype.findIndex() 方法会改变原数组，因此需要谨慎使用。
2. 回调函数 callback 中 return 的值必须是一个布尔值，否则会导致 findIndex() 抛出错误。
3. callback 函数中的 this 默认是指向全局对象的，如果想要指定 this 的值，需要使用 thisArg 参数。

总结

使用 Array.prototype.findIndex() 方法能够更加方便、快捷地查找数组中符合条件的元素，并返回其索引值。但需要注意该方法的返回值和参数，以避免出现意外情况。在日常前端开发中，了解该方法能够帮助我们更好地利用代码资源，提高开发效率。

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