find 和 findIndex 的讲解和实现

2024-07-29 17:14:37 浏览数 (1)

findIndex

在 JavaScript 中,findIndex 是一个数组方法,用于查找数组中满足指定条件的元素的索引。它的基本语法如下:

代码语言:javascript复制
 array.findIndex(callback(element[, index[, array]])[, thisArg])

让我们逐个解释这些参数和用法:

  • array:要在其中查找元素的数组。
  • callback:一个回调函数,用于定义查找条件。它接收三个参数:
    • element:当前正在被处理的数组元素。
    • index(可选):当前元素的索引。
    • array(可选):调用 findIndex 的数组。 回调函数应返回一个布尔值,表示当前元素是否满足条件。
  • thisArg(可选):在执行回调函数时使用的 this 值。

findIndex 方法会从数组的第一个元素开始遍历,直到找到满足条件的元素或遍历完整个数组。如果找到满足条件的元素,则返回该元素的索引;否则返回 -1

下面是一个简单的示例,演示如何使用 findIndex 方法:

代码语言:javascript复制
 const numbers = [1, 2, 3, 4, 5];
 ​
 const greaterThanThreeIndex = numbers.findIndex((element) => element > 3);
 console.log(greaterThanThreeIndex); // 输出: 3

在上面的例子中,我们定义了一个数组 numbers,然后使用 findIndex 方法查找第一个大于 3 的元素的索引。由于 4 是第一个满足条件的元素,所以返回索引 3。

需要注意的是,findIndex 方法是 ES6 中引入的新特性,因此在较旧的浏览器或环境中可能不被支持。如果需要在不支持的环境中使用该方法,可以考虑使用 polyfill 或其他类似的解决方案来实现相同的功能。

代码语言:javascript复制
const arr1 = [1, 2, 3, 4, 5]
Array.prototype.myFindIndex = function (cb) {
    for (let i = 0; i < this.length; i  ) {
        // 如果找到 返回当前元素的索引
        if (cb(this[i], i, this)) {
            return i
        }
      

    }
      // 如果上面结束 还没有找到, 就   返回-1
      return -1
}

const index = arr1.myFindIndex(function (item) {
    return item == 3
})

console.log(index);

find

find 是 JavaScript 中的另一个数组方法,它与 findIndex 类似,但返回的是满足条件的元素本身,而不是索引

代码语言:javascript复制
const arr1 = [1, 2, 3, 4, 5]
Array.prototype.myFindIndex = function (cb) {
    for (let i = 0; i < this.length; i  ) {
        // 如果找到 返回当前元素
        if (cb(this[i], i, this)) {
            return this[i]
        }

    }
      // 如果上面结束 还没有找到, 就 undefined
      return undefined
}

const index = arr1.myFindIndex(function (item) {
    return item == 3
})

console.log(index);

0 人点赞