JavaScript中Array.findIndex方法的使用方法及示例

一、Array.findIndex()方法简介

Array.findIndex()方法是在Javascript ES6中添加的一个新数组方法，该方法可以在数组中查找一个元素，并返回该元素在数组中的位置（即索引）。

该方法的语法为：

arr.findIndex(callback(element[, index[, array]])[, thisArg])

• callback：数组中每个元素都会调用该函数，函数返回值为true时，返回该元素在数组中的索引值，返回false时，继续查找下一个元素。
• element：当前遍历到的元素。
• index：当前遍历到元素在数组中的索引值。
• array：操作的数组。
• thisArg：执行 callback 时使用的 this 值。

二、Array.findIndex()方法示例

下面是一个使用Array.findIndex()方法的示例代码：

const arr = [2, 5, 8, 1, 4];
const result = arr.findIndex(function(ele) {
  return ele > 3;
});
console.log(result);//2

上述代码中，我们创建了一个数组 arr，然后使用 .findIndex() 方法来查找数组中第一个大于3的元素，并返回该元素的索引位置。在该示例中，第一个大于3的元素是8，其在数组中的位置为2，因此该代码输出结果为2。

三、Array.findIndex()方法详解

1、callback的三个参数

在上述示例代码中，我们将callback函数中的ele作为比较值，查找数组中第一个大于3的元素。除ele参数外，callback函数还有两个可选参数 - index和array。

其中index为当前遍历到元素在数组中的位置，array为原始数组本身。例如：

const myArr = [1,5,10,15];
myArr.findIndex(function(ele,index,array) {
  console.log('ele:',ele);//依次输出1,5,10,15
  console.log('index:',index);//依次输出0,1,2,3
  console.log('array:',array);//输出[1,5,10,15]
});

2、callback返回值的处理

Array.prototype.findIndex() 方法返回一个满足指定测试函数的第一个元素的索引。否则返回-1。

const arr = [1,2,3,4,5,6];
console.log(arr.findIndex(function(ele) {
  return ele>8;
}));
//输出结果为：-1，因为该数组中不存在大于8的元素。

四、总结

本文主要介绍了JavaScript中Array.findIndex()方法的使用方法及示例。

• 我们首先介绍了Array.findIndex()方法的语法及参数解释。
• 接着我们展示了一个Array.findIndex()方法的基本使用示例。
• 最后我们详解了callback中三个参数的用法及callback返回值的处理方法。