JavaScript数组的reduce()方法

参考文章：
Array.prototype.reduce() —— MDN

一、介绍

reduce() 方法对数组中的每个元素按顺序执行一个由您提供的 reducer 函数, 每一次运行 reducer 都会将先前元素的计算结果作为参数传入, 最后将结果 汇总为单个返回值

注意: reduce() 对于空数组是不会执行回调函数的.

二、语法

array.reduce( function(total, currentValue [, currentIndex, arr ]) [, initialValue ] )

参数	描述
function(total, currentValue, currentIndex, arr)	必需, 用于执行每个数组元素的 'reducer' 函数
initialValue	可选, 第一次调用函数的初始值

函数参数	描述
total	必需, 初始值, 或者计算结束后的返回值
currentValue	必需, 当前元素
currentIndex	可选, 当前元素的索引
arr	可选, 当前元素的数组对象

三、使用

3.1. 简单求和

let arr = [1, 2, 3, 4, 5]
 
let sum1 = arr.reduce(function(prev, cur) {
    return prev + cur
})
 
// 使用箭头函数优化
 
let sum2 = arr.reduce((prev, cur) => prev + cur)
console.log(sum1, sum2) // 15 15

3.2. 带初始值求和

let arr = [1, 2, 3, 4, 5]
 
let sum1 = arr.reduce(function(prev, cur) {
    return prev + cur
}, 99)
 
// 使用箭头函数的写法:
 
let sum2 = arr.reduce((prev, cur) => prev + cur, 99)
console.log(sum1, sum2) // 114 114

3.3. 计算每个元素出现次数

let arr = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice']
 
let arrResult = arr.reduce((pre, cur) => {
    if (cur in pre) {
        pre[cur]++
    } else {
        pre[cur] = 1
    }
 
    return pre
}, {})
console.log(arrResult)
// { Alice: 2, Bob: 1, Tiff: 1, Bruce: 1 }
 

3.4. 扁平化数组

let arr = [
    [1, 2],
    [3, 4], 5,
    [6, 7],
]
 
let newArr1 = arr.reduce(function(prev, cur) {
    return prev.concat(cur)
}, [])
console.log(newArr1) // [ 1, 2, 3, 4, 5, 6, 7]
 
// 使用箭头函数的写法:
 
let newArr2 = arr.reduce((prev, cur) => prev.concat(cur), [])
console.log(newArr2) // [ 1, 2, 3, 4, 5, 6, 7]

3.5. 数组去重

let arr = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd']
 
let newArr = arr.reduce((prev, cur) => {
    if (prev.indexOf(cur) === -1) {
        prev.push(cur)
    }
 
    return prev
}, [])
 
console.log(newArr) //  [ 'a', 'b', 'c', 'e', 'd' ]