reduce函数 数组内数据计算

背景：项目中需要计算n个数据的累加，累乘等等

先介绍一下reduce函数的职能：

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

下面用代码给大家介绍这个函数的参数，方便理解:

let arr = [ 1, 2, 3 ] // 实例数据

arr.reduce( function( total, currentValue, index, arr) {}, initialValue )

// total: 必需。初始值, 计算结束后的返回值。
// currentValue: 必需。当前元素
// currentIndex: 可选。当前元素的索引
// arr: 可选。当前元素所属的数组对象。
// initialValue: 可选。传递给函数的初始值

最后一个参数的这个初始值就是total的初始值，因为total不能直接设置需要设置initialValue

let arr = [ 1, 2, 3, 4 ]
let sum = arr.reduce((total, value)=>{
    return total + value
})
// sum = 10

// 当 return total * value 时 sum = 24
// 当然减法，除法也可以使用，还可以配饰Math函数的四舍五入计算小数
// 比如：
arr = [1.5, 2.3, 1.1, 1.2] 

sum = arr.reduce((total, value)=>{
    return total + Math.round(num)
})

// sum = 6

 这个就是函数的基本用法,深入了解一下这个函数，其实就是类似于map，foreach的循环

let arr = [ { num: 1 }, { num: 2 }, { num: 3 } ]
let sum = arr.reduce((total, value)=>{ // 这时的value就是对象
    return total + value.num
},0)
// sum = 6

注：这里必须指定初识值，而不能使用写 return total.num + value.num,虽然直接打印一下total会是第一个对象，但是如果这样写在下一次计算的时候 total 会是上次计算的结果是个数字是没有num属性的！

其实在简单点这个total是和 currentValue, index, arr 没什么关系的，只是这个函数的返回值而已

let arr = ['菠萝','香蕉','樱桃','菠萝','菠萝','香蕉']
let obj = arr.reduce((obj, value) =>{ // total只是个字段可以随便换的，方便理解我换为obj
    obj[value] ? obj[value]++ : obj[value] = 1
    return obj
}, {})
console.log(obj);
// obj = {菠萝: 3, 香蕉: 2, 樱桃: 1}

比如上面，我定义一个初始值空对象，经过循环就可以拿到每个值出现的次数，他就是个循环而已，不要被他的参数多给唬住就好233

最后没怎么提到的index，arr

let arr = [ 1, 2, 3 ] // 实例数据

arr.reduce( function( total, currentValue, index, arr) {
    console.log(index)
    console.log(arr)
    console.log(arr[index])
}，0)

// 分别打印下边 0 1 2 和 打印三次 arr数组
// 和数组对应下标的值 1 2 3

只有初始化init赋值后才会走index为0，没有初识值的话，函数将直接开始打印index为1，跳过了index为0 的一段循环