前端手写练习题及概念加深

通过举例和实际例子来加深前端的概念形式 

1. 手写reduce

用法：

// 手写 reduce
const a = [1, 3, 6, 8]

const sum = a.reduce((accu, curr) => accu + curr, 0)
console.log('sum', sum )

在注释中解释 reduce 的手写方法

// 1. 明确参数累加函数，接受两个参数，回调函数和初始值
const sum = a.reduce((accu, curr) => accu + curr, 0)
console.log('sum', sum )

// 用原型的方式来定义方法
Array.prototype.myReduce = function(callback, initialValue) {
    // 分清可能的边界情况
    if(typeof callback !== 'function') {
        throw `${callback} is not a function`
    }
// 如果没有定义 initialValue的话，初始为 0
    initialValue = initialValue ? initialValue : 0
    // reduce本质上是遍历数组的参数, this为调用的数组
    let arr = this
    // 定义最后返回的累加值
    let result = initialValue
    for(let i = 0 ; i <  arr.length; i = i + 1) {
        // 传入的回调函数，接受参数为累加i值，当前数组数，index, 和 arr
        result = callback(result, arr[i], i, arr)
    }
    return result

}

const sum2 = a.myReduce((accu, curr) => accu + curr, 0)
console.log('sum', sum2 )

2. 手写链式方法

题目

手写 LazyMan ，实现 sleep 和 eat 两个方法，支持链式调用。 代码示例：

const me = new LazyMan('tom')
me.eat('苹果').eat('香蕉').sleep(5).eat('葡萄') // 打印结果如下：

// 'tom eat 苹果'
// 'tom eat 香蕉'
// （等待 5s）
// 'tom eat 葡萄'

题目分析：用 taskQueue来实现或者或 Promise     

class LazyMan {
    constructor(name) {
        this.name = name
        this.promiseChain = Promise.resolve()
    }

    sleep(second) {
        this.promiseChain = this.promiseChain.then(() => {
            return new Promise((resolve, reject)