ES6 find / findIndex 底层详解

1.作用

ES6 提供了 find 以及 findIndex 方法，可以让我们在数据中根据条件找出需要的项。

二者原理相同，都接受一个回调函数。只是一个返回 符合条件的数据，一个返回符合条件的数据下标

// find 
var a = [
  {
    
     id: 1, name:'张三' },
  {
    
     id: 2, name:'王五' }
]
    
var data =  a.find(function (item) {
    
    
  return item.id === 1
})

data // {id: 1, name: "张三"}

// findIndex
var a = [
  {
    
     id: 1, name:'张三' },
  {
    
     id: 2, name:'王五' }
]
    
var data =  a.find(function (item) {
    
    
  return item.id === 2
})

data // 1

下面来用原生实现一下

// findIndex
let a = [
  {
    
     id: 1, name:'张三' },
  {
    
     id: 2, name:'王五' }
]
    
Array.prototype.newFindIndex = function(callback) {
    
    
  for(let i = 0; i < this.length; i++) {
    
    
    if(callback(this[i], i)) {
    
    
  	  return i
    }
  }
}
let res = a.newFindIndex(function (item) {
    
    
  return item.id === 1
})
res // 0

// find
let a = [
  {
    
     id: 1, name:'张三' },
  {
    
     id: 2, name:'王五' }
]
    
Array.prototype.newFind = function(callback) {
    
    
  for(let i = 0; i < this.length; i++) {
    
    
    if(callback(this[i], i)) {
    
    
  	  return this[i]
    }
  }
}
let res = a.newFind(function (item) {
    
    
  return item.id === 1
})
res // { id: 1, name:'张三' }