ES7 中的 Array.prototype.findIndex 函数详解

JavaScript 是一种面向对象、基于原型和事件驱动的编程语言，被广泛应用于前端开发、游戏开发等领域。而在 ECMAScript 7 中，新增了 Array.prototype.findIndex 函数，它可以快速准确地找出数组元素中第一个符合条件的索引值，下面我们来详细了解一下这个函数。

简介

Array.prototype.findIndex 是 ES7 新增的方法，它与 Array.prototype.find 函数类似，但返回的是该元素在数组中的索引值，而不是元素本身。findIndex 函数接受一个回调函数作为参数，遍历数组元素，并对每个元素执行一次该回调函数，如果该回调函数返回 true，则返回该元素在数组中的索引值。如果数组中没有符合条件的元素，则返回 -1。

语法

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

参数

返回值

符合条件的第一个元素的索引值。

例子

下面的代码演示了如何使用 findIndex 函数查找数组中第一个大于 10 的元素的索引值：

const arr = [5, 12, 8, 23, 17];

const index = arr.findIndex((el) => el > 10);

console.log(index); // 输出 1

在这个例子中，回调函数 (el) => el > 10 返回了 true 值，因此 findIndex 函数返回的是符合条件的第一个元素的索引值 1。

还可以传入第二个参数指定回调函数执行时的 this 指向：

const obj = {
  min: 10,
  max: 20,
};

const arr = [5, 12, 8, 23, 17];

const index = arr.findIndex(function (el) {
  return el > this.min && el < this.max;
}, obj);

console.log(index); // 输出 4

在这个例子中，回调函数内部使用 this.min 和 this.max 访问了外部的 obj 对象，使用第二个参数将 obj 对象传递给了 findIndex 函数，从而保持了 this 指针的正确性。

总结

Array.prototype.findIndex 函数是 ES7 新增的方法，用于查找数组元素中第一个符合条件的索引值。它接受一个回调函数作为参数，该函数的返回值为布尔类型。如果该函数返回 true，则返回该元素在数组中的索引。如果数组中没有符合条件的元素，则返回 -1。同时，findIndex 函数也支持通过第二个参数指定执行回调函数时的 this 指向。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65937de5eb4cecbf2d8358d7