find 和 findIndex 的讲解和实现

findIndex

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

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

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

• array：要在其中查找元素的数组。

• callback：一个回调函数，用于定义查找条件。它接收三个参数：

  • element：当前正在被处理的数组元素。
  • index（可选）：当前元素的索引。
  • array（可选）：调用 findIndex 的数组。 回调函数应返回一个布尔值，表示当前元素是否满足条件。

• thisArg（可选）：在执行回调函数时使用的 this 值。

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

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

 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 或其他类似的解决方案来实现相同的功能。

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 类似，但返回的是满足条件的元素本身，而不是索引

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);