promise实现原理

2022-06-22  本文已影响0人  灵魂旅者s

promise主要的API方法如下

Promise.all()  // 全部执行完后更新状态 如果都是成功则由返回值组成一个数组返回,如果有失败的则返回第一个失败

Promise.race()  // 赛跑方式那个先更新状态 则返回更新状态不用等全部都执行完

Promise.resolve()  //  将Promise对象的状态从 Pending(进行中) 变为 Fulfilled(已成功)

Promise.reject()  // 将Promise对象的状态从 Pending(进行中) 变为 Rejected(已失败)

Promise.prototype.catch()  //相当于调用 then 方法, 但只传入 Rejected 状态的回调函数

Promise.prototype.finally()  // 用于指定不管 Promise 对象最后状态如何,都会执行的操作

Promise.prototype.then() // 接受两个参数:onFulfilled 和 onRejected 都是可选参数

简单实现 all 静态方法实现

class MyPromise {

    // 构造方法接收一个回调

    constructor(executor) {

      this._resolveQueue = []    // then收集的执行成功的回调队列

      this._rejectQueue = []     // then收集的执行失败的回调队列

// 由于resolve/reject是在executor内部被调用, 因此需要使用箭头函数固定this指向, 否则找不到

this._resolveQueue

      let _resolve = (val) => {

        // 从成功队列里取出回调依次执行

        while(this._resolveQueue.length) {

          const callback = this._resolveQueue.shift()

          callback(val)

        }

      }

      // 实现同resolve

      let _reject = (val) => {

        while(this._rejectQueue.length) {

          const callback = this._rejectQueue.shift()

          callback(val)

        }

      }

      // new Promise()时立即执行executor,并传入resolve和reject

      executor(_resolve, _reject)

    }

 // then方法,接收一个成功的回调和一个失败的回调,并push进对应队列

    then(resolveFn, rejectFn) {

      this._resolveQueue.push(resolveFn)

      this._rejectQueue.push(rejectFn)

    }

  }

上一篇 下一篇

猜你喜欢

热点阅读