Array.prototype.reduce小结

每天做个总结吧，坚持就是胜利！

    /**
        @date 2021-07-09
        @description Array.prototype.reduce小结
    */
复制代码

壹（序）

Array.prototype.reduce对数组的每个元素执行传入的函数，并使用一个累加器汇总结果，最后返回这个累加器。

reduce接受两个参数，一是回调函数，二是初始值

回调函数接受4个参数：

1. accumulator：累加器，每次运行回调函数返回的值，以及最后返回的值
2. current：当前值
3. index：当前索引
4. source：源数组

初始值是作为第一次调用回调函数时传入的acc，是可选的，如果不传的话，使用数组第一个值作为初始值，且数组第一个值不会调用回调函数。同时，在空数组上调用reduce时，不传初始值会报错。

贰（使用）

在你想要基于数组做一些操作，然后返回一个值时，可以使用reduce，比如

计算数组和：

const arr = [1, 2, 3, 4];
const sum = arr.reduce((acc, cur) => {
  return acc + cur;
});

console.log(sum); // 10
复制代码

数组去重：

const arr = [1, 2, 3, 4, 1, 5, 4, 2, true, false, true, NaN, NaN, null, null, '', ''];

const newArr = arr.reduce((acc, cur) => {
  if (!acc.includes(cur)) {
    acc.push(cur);
  }

  return acc;
}, []);

console.log(newArr); // [ 1, 2, 3, 4, 5, true, false, NaN, null, '' ]
复制代码

我觉得在开发中使用reduce可以优雅且装杯，有兴趣可以掌握一下，举一个自己的例子，之前做一个查询的功能函数，使用reduce之前代码高达几十行，使用reduce只用了一行，当时是刚接触reduce，觉得太厉害了，所以后面就尽量使用reduce了。

叁（手写实现）

今天有个题是实现reduce，但是我没选择这道题（我应该选的），所以回家之后写一下：

Array.prototype.myReduce = function (callback, initVal) {
  // 获取源数组
  const self = this;
  // 声明累加器
  let acc;

  if (!initVal) {
    if (self.length === 0) {
      // 在不传initVal及数组为空的情况下，抛出错误
      throw TypeError('Reduce of empty array with no initial value');
    }
    // 不传initVal但数组有值的情况下，第一次acc为数组第一个值
    acc = self[0];
  } else {
    // 传入initVal但是数组为空，则第一次acc为initVal
    if (self.length === 0) {
      acc = initVal;
    } else {
      // 传入initVal且数组不为空，第一次acc为调用回调函数
      acc = callback(initVal, self[0], 0, self);
    }
  }

  // 遍历数组剩下的值，并进行累加
  for (let i = 1; i < self.length; i++) {
    acc = callback(acc, self[i], i, self);
  }

  return acc;
};
复制代码