ES2015 (ES6) 新增的方法

参数

回调函数
thisArg 更改回调函数内部的this指向
- 非严格模式下不传入时， this->window
- 严格模式下不传入第二个参数 undefined，与严格模式规定相统一
  回调函数参数
item 当前遍历的元素
index 当前遍历出的元素对应的下标
arr 当前数组 ```javascript const arr = [1,2,3,4,5];

//返回第一个满足条件的数组元素 const item = arr.find(item => item > 3); // 4

//如果没有满足条件返回undefined const item = arr.find(function(item){ return item > 5; }) // undefined

// ———————————————— const arr = [{ id: 1, name: ‘张三’ }, { id: 2, name: ‘李四’ },{ id: 3, name: ‘王五’ }]

const item = arr.find(item => item.name === ‘李四’);

// 返回元素和数组对应下标的元素是同一个引用 item === arr[1]; // true

// 回调函数的返回值是bool，第一个返回true的对应数组元素作为find的返回值 const item = arr.find(function(item){ return item.id > 1; }); / { id: 2, name: ‘李四’ } /

// ———————————————— const arr = [1, 2, 3, 4, 5]; // find是不会更改数组 const item = arr.find(function(item){ console.log(‘Gone’); item = item + 1; });

arr // [1, 2, 3, 4, 5]

// 新增了元素，但find会在第一次执行回调函数时候，拿到这个数组的最初索引范围 const item = arr.find(function(item){ arr.push(6); }); arr // [1, 2, 3, 4, 5, 6, 6, 6, 6, 6]

// ———————————————— const arr = [1,2,3,,,,7,8,9]; arr.find(function(item, index){ if(index === 0){ arr.splice(1, 1); //删除对应项，该项位置不保留，但在数据最后补上undefined / console.log(item); 1 3 undefined undefined undefined 7 8 9 undefined /

delete arr[1]; //删除该项的值并填入undefined
/*
    console.log(item);
    1
  undefined
  3
  undefined
  undefined
  undefined
  7
  8
  9
*/
arr.pop(); //删除该项的值并填入undefined
/*
    console.log(item);
    1
  undefined
  3
  undefined
  undefined
  undefined
  7
  8
  9
*/

} });

// ————————————————

<a name="Fzx5e"></a>
## 对稀疏数组的表现
```javascript
const arr = Array(5); // [ empty x 5 ]
arr[0] = 1;
arr[2] = 3;
arr[4] = 5;
// [1, , 3, , 5] 稀疏数组 即元素与元素之间是有空隙

// find的遍历不会放过稀疏数组的空隙, 空隙的item为undefined点位
const item = arr.find(function(item){
  console.log(item);
    return false;
});
/*
    1
  undefined
  3
  undefined
  5
*/

// ES5数组扩展方法只会遍历有值的索引
arr.forEach(item => console.log(item)); // 1 3 5
arr.map(item => console.log(item)); // 1 3 5
arr.filter(item => console.log(item)); // 1 3 5
arr.reduce(item => console.log('Gone'), []); // 3 x Gone
arr.reduceRight(item => console.log('Gone'), []); // 3 x Gone
arr.every(function(item){
  console.log('Gone'); 
  return true;
}); // 3 x Gone
arr.some(function(item){
  console.log('Gone'); 
  return false;
}); // 3 x Gone

find的遍历效率是低于ES5数组扩展方法

polyfill

Array.prototype.myFind = function (cb) {
    if(this === null){
      throw new TypeError(`"this" is null`);
  }

  if(typeof cb !== 'function'){
      throw new TypeError('Callback must be a function type');
  }

  var obj = Object(this),
      len = obj.length >>> 0,
      arg2 = arguments[1],
      step = 0;

  while(step<len){
      var value = obj[step];
    if(cb.apply(arg2, [value, step, obj])){
        return value;
    }

    step ++;
  }

  return undefined;
}

ECMAScript

Array.prototype.find()

参数

回调函数参数

polyfill