美文网首页
Promise then方法的链式调用

Promise then方法的链式调用

作者: 湘兰沅芷 | 来源:发表于2021-12-13 23:05 被阅读0次

    返回的是非promise对象

    const PENDING = 'pending' // 等待
    const FULFILLED = 'fulfilled' // 成功
    const REJECTED = 'rejected'// 失败
    class MyPromise {
      constructor(executor) {
        executor(this.resolve, this.reject)
      }
      status = PENDING
      value = undefined
      reason = undefined
      successCallback = []
      failCallback = []
      resolve = value => {
        if (this.status !== PENDING) return
        // 将状态修改为成功
        this.status = FULFILLED
        // 保存成功之后的值
        this.value = value
        // this.successCallback && this.successCallback(this.value)
        while(this.successCallback.length) {
          this.successCallback.shift()(this.value)
        }
      }
      reject = reason => {
        if (this.status !== PENDING) return
        this.status = REJECTED
        this.reason = reason
        // this.failCallback && this.failCallback(this.reason)
        while(this.failCallback.length) {
          this.failCallback.shift()(this.reason)
        }
      }
      then(successCallback, failCallback) {
        let promise2 = new MyPromise((resolve, reject) => {
          if (this.status === FULFILLED) {
            let x = successCallback(this.value)
            resolve(x)
          } else if (this.status === REJECTED) {
            failCallback(this.reason)
          } else {
            // 等待
            // 讲成功回调和失败回调进行存储
            this.successCallback.push(successCallback)
            this.failCallback.push(failCallback)
          }
        })
        return promise2 // 返回promise对象
      }
    }
    
    module.exports = MyPromise
    

    优化:可能返回promise对象和非promise对象

    const MyPromise = require('./myPromise')
    let promise = new MyPromise((resolve, reject) => {
      // setTimeout(() => {
      //   resolve('成功')
      // }, 2000)
      resolve('成功')
      // reject('失败')
    })
    function other () {
      return new MyPromise((resolve, reject) => {
        resolve('other')
        // reject('no')
      })
    }
    promise.then(value => {
      console.log(value);
      return other()
    }, reason => {
      console.log('no1')
    }).then(value => {
      console.log('yes');
    }, reason => {
      console.log('no2')
    })
    // promise.then(value => {
    //   console.log(value);
    // }, reason => {
    //   console.log(reason)
    // });
    
    
    const PENDING = 'pending' // 等待
    const FULFILLED = 'fulfilled' // 成功
    const REJECTED = 'rejected'// 失败
    class MyPromise {
      constructor(executor) {
        executor(this.resolve, this.reject)
      }
      status = PENDING
      value = undefined
      reason = undefined
      successCallback = []
      failCallback = []
      resolve = value => {
        if (this.status !== PENDING) return
        // 将状态修改为成功
        this.status = FULFILLED
        // 保存成功之后的值
        this.value = value
        // this.successCallback && this.successCallback(this.value)
        while(this.successCallback.length) {
          this.successCallback.shift()(this.value)
        }
      }
      reject = reason => {
        if (this.status !== PENDING) return
        this.status = REJECTED
        this.reason = reason
        // this.failCallback && this.failCallback(this.reason)
        while(this.failCallback.length) {
          this.failCallback.shift()(this.reason)
        }
      }
      then(successCallback, failCallback) {
        let promise2 = new MyPromise((resolve, reject) => {
          if (this.status === FULFILLED) {
            let x = successCallback(this.value)
            // resolve(x)
            resolvePromise(x, resolve, reject)
          } else if (this.status === REJECTED) {
            failCallback(this.reason)
          } else {
            // 等待
            // 讲成功回调和失败回调进行存储
            this.successCallback.push(successCallback)
            this.failCallback.push(failCallback)
          }
        })
        return promise2
      }
    }
    
    function resolvePromise(x, resolve, reject) {
      if (x instanceof MyPromise) {
        // x.then(value => resolve(value), reason => reject(reason))
        x.then(resolve, reject)
      } else {
        resolve(x)
      }
    }
    
    module.exports = MyPromise
    

    相关文章

      网友评论

          本文标题:Promise then方法的链式调用

          本文链接:https://www.haomeiwen.com/subject/axnrfrtx.html