史上最简单的手写Promise，仅17行代码即可实现Promise链式调用

Promise的使用相比大家已经孰能生巧了，我这里就不赘述了

先说说我写的Promise的问题吧，无法实现宏任务和微任务里的正确执行（也就是在Promise里面写setTimeout，setInterval的话，输出顺序会有问题），其他的API（catch、finally、race、all）有兴趣的话，大家可以斟酌补充。

开始贴代码：

// 定义一个Promise类
function Promise(fn){
    // 回调队列 存放的所有的.then里面的回调

    this.callbacks = [];
    // resolve(val)后 真正被执行的代码

    let resolve = (val) => {
        // resolve 调用是异步的(微任务)

        setTimeout(()=>{
            // 从回调队列的头部拿一个回调方法

            let callback = this.callbacks.shift();
            // 执行回调方法并获取返回值 pms

            let pms = callback.call(this,val)
            // 容错处理 如果pms有值 再赋值

            if(pms){
                // 将回调队列赋值给下一个promise

                pms.callbacks = this.callbacks;

            }

        }, 0)

    }
    // fn是初始化promise传入的 执行函数 是同步执行的 传入我们的resolve函数

    fn.call(this,resolve)

}
// 实现then方法

Promise.prototype.then =function(cb){
    //将回调函数放至回调队列里

    this.callbacks.push(cb);
    // return this 实现链式调用

    return this;

}

　　测试代码

new Promise ((resolve,reject)=>{

    console.log(1)

    resolve(3);

}).then(val=>{

    console.log(val)

    return new Promise ((resolve,reject)=>{

       resolve(4)

    })

}).then(val=>{

    console.log(val)

    return new Promise((resolve,reject) => {

        resolve(5)

    })

}).then(val=>{

    console.log(val)

})

console.log(2)

史上最简单的手写Promise，仅17行代码即可实现Promise链式调用的相关教程结束。