JavaScript高阶函数 reduce方法的应用和原理分析

/**
 *  reduce()
 *  用来做数组的累积
 */
var arr = [1, 2, 3, 4, 5]

// es5写法
var result = arr.reduce(function(prev, curr) {
    return prev + curr
})
console.log(result)

// es6写法
var ret = arr.reduce((prev, curr) => prev + curr)
console.log(ret)

// 分析


// reduce是可以有第二个参数的
// 如果第二个参数存在那么prev的初始值九尾第二个参数的值 多遍历了一次  5
// 如果不存在初始值那么prev的初始值就为arr[0]  4

/**
 *  分析：首先我们 console.log(prev, curr);
 *  结果
 *      1   2       prev  curr
 *      3   3       上一个prev+curr作为这次的prev
 *      6   4
 *      10  5
 *      15
 *      实际上执行了三次第一次不算执行
 */

// 实现的原理

Array.prototype.myReduce = function(fn, initialValue) {
    if (this.length === 0) {
        if (initialValue === undefined) {
            console.error("reduce of empty array with no initialValue")
        } else {
            return initialValue
        }
    } else {
        var prev = initialValue !== undefined ? initialValue : this[0]
        var startIndex = initialValue !== undefined ? 0 : 1
        for (var i = startIndex; i < this.length; i++) {
            prev = fn(prev, this[i])
        }
        return prev
    }
}
var ret = arr.myReduce(function(prev, curr) {
    return prev + curr
}, 5)

console.log(ret)

//  user里所有age的和
var user = [
    { name: '小明', age: 13 },
    { name: '李雷', age: 15 },
    { name: '张三', age: 15 },
    { name: '小花', age: 17 }
]


var sumsAge = user.reduce(function(prev, curr) {
    // 下一行的prev是不能.age的 因为prev是上一个prev和curr的和 数字是.不了age的 所以会报错
    return prev + curr.age
}, 0)
// 这个0是指定prev的初始值
console.log(sumsAge);

// 当初始值不存在的时候 user为空那么会报错

// 把user里的数据放到数组里
console.log(user.reduce(function(prev, curr) {
    // console.log(prev, curr)
    prev.push({
        name: curr.name,
        age: curr.age
    })
    return prev
}, []))