JavaScript中的reduce的使用

reduce在JavaScript中虽然应用不是很广泛,但很重要。

reduce方法一共可以有两个参数,一个是callback也就是回到函数,另一个是初始值initValue,也就是回调函数的初始值。其中callback是必须的。

callback可以有四个参数,分别是累加器,当前值、前端索引和源数组。其中累加器和当前值是必须的。

下面列举一下reduce的使用

1,数组求和

var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
  return accumulator + currentValue;
});

如果没有initValue,则累加器默认用数组的第一个参数值,如果使用了initValue,则累加器的第一个值为初始值

var sum =  [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
  return accumulator + currentValue;
},true);
console.log(sum,'sum') // 7

2,将二维数组转为一维数组

  var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
            function (a, b) {
                return a.concat(b);
            },
            []
        );

不过上面的方法只能是将二维数组转为一维数组,三维数组不行。三维数组的处理可以用下面的代码

let array = [1, [2], [3, [4, [5]]]]
        function flat(arr) {
            return arr.reduce((pre, value) => {
                return Array.isArray(value) ? [...pre, ...flat(value)] : [...pre, value]
            }, [])
        }

3,计算数组中每个元素出现的次数

var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

        var countedNames = names.reduce(function (allNames, name) {
            if (name in allNames) {
                allNames[name]++;
            }
            else {
                allNames[name] = 1;
            }
            return allNames;
        }, {});