ES6 -- findIndex

findIndex

基本使用

Array.prototype.findIndex
返回第一个满足条件的数组对应的元素下标

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex((item) => item > 2);
console.log(idx); //2

没有找到符合条件的元素 返回-1
数组长度为空的情况 返回-1

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex((item) => item > 5);
console.log(idx); //-1

const arr = [];
const idx = arr.findIndex((item) => item > 2);
console.log(idx); //-1

是正常遍历稀松数组的空隙

const arr1 = [, 2, , , , , ,];
const idx = arr1.findIndex((item) => item === 2);
console.log(idx);//1

空隙被填充为undefined

const arr1 = [, 2, , , , , ,];
const idx = arr1.findIndex(function (item) {
  console.log(item);
  return item === 2;
});
console.log(idx);

findIndex如果回调返回true 遍历就停止

第一个参数 回调函数

回调函数的三个参数
遍历当前数组元素 元素对应的下标 原数组
回调的返回值是boolean 遍历在某一次返回true 停止

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item, index, arr) {
  console.log(item, index, arr);
  console.log(this);
});

回调函数内部是无法改变数组的元素值

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item) {
  item += 1;
});
console.log(arr);

虽然增加了元素 但是遍历只会进行五次
findIndex 与 find 相同 只会在第一次调用回调函数的时候确认数组的范围

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item) {
  arr.push(6);
  console.log(item);
});
console.log(arr);

splice 在最后走的一次 （第五次）补上undefined 删除第一次的 下标为1的项

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item, index) {
  if (index === 0) {
    arr.splice(1, 1);
  }
  console.log(item);
});
console.log(arr);

delete 删除对应下标的值并补上undefined 实际数组中 对应下标变成空隙 empty

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item, index) {
  if (index === 0) {
    delete arr[1];
  }
  console.log(item);
});
console.log(arr);

pop 删除元素下标对应的值 补undefined 实际数组被删除最后一项

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item, index) {
  if (index === 0) {
    arr.pop();
  }
  console.log(item);
});
console.log(arr);

第二个参数

更改回调内部的this指向
默认情况下 this -> window
设置了第二个参数 this -> arg2

const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(
  function (item, index, arr) {
    console.log(item, index, arr);
    console.log(this);
  },
  { a: 1 }
);

严格模式下不传第二个参数 this 是undefined

'use strict';
const arr = [1, 2, 3, 4, 5];
const idx = arr.findIndex(function (item, index, arr) {
  console.log(item, index, arr);
  console.log(this);
});

实现myFindIndex

Array.prototype.myFindIndex = function (cb) {
  if (this == null) {
    throw new TypeError('"this" is null');
  }
  if (typeof cb !== 'function') {
    throw new TypeError('Callback must be a function');
  }
  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 step;
    }
    step++;
  }
  return -1;
};