手写Promise(转)

// <!--  简易版的promise -->
    const PENDING = "pending"
    const RESOLVE = "resolve"
    const REJECT = "reject"

    function MyPromise(fn) {
      const that = this
      that.status = PENDING // MyPromise 内部状态
      that.value = null // 传入 resolve 和 reject 的值
      that.resolveCallbacks = [] // 保存 then 中resolve的回调函数
      that.rejectCallbacks = [] // 保存 then 中reject的回调函数

      // resolve 函数 Promise内部调用 resolve 函数 例:new MyPromise((resolve,reject)=>{resolve(1)})
      function resolve(val) {
        if (that.status === PENDING) {
          that.status = resolve
          that.value = val
          that.resolveCallbacks.map(cb => cb(that.value))
        }
      }
      // reject 函数 Promise内部调用的 reject 函数 例:new MyPromise((resolve,reject)=>{reject(1)})
      function reject(val) {
        if (that.status === PENDING) {
          that.status = REJECT
          that.value = val
          that.rejectCallbacks.map(cb => cb(that.value))
        }
      }
      // 调用传入 MyPromise 内的方法 例:new MyPromise((resolve,reject)=>{})   fn=(resolve,reject)=>{}
      try {
        fn(resolve, reject)
      } catch (error) {
        reject(error)
      }
    }
    // 在原型上添加then方法
    MyPromise.prototype.then = function (onFulfilled, onRejected) {
      const that = this
      // 判断传入的是否为函数
      onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v
      onRejected = typeof onRejected === 'function' ? onRejected : r => {
        throw r
      }

      //如果 Promise 内部存在异步代码,调用then方法时,此时 promise 内部还是 PENDING 状态,将 then 里面的函数添加进回调数组,当异步处理完成后调用 MyPromise 内部的 resolve 或者 reject 函数
      if (that.status === PENDING) {
        that.resolveCallbacks.push(onFulfilled)
        that.rejectCallbacks.push(onRejected)
      }

      // 当 Promise 内部的状态已经为 resolve,则调用 then 里面的函数并传递值
      if (that.status === RESOLVE) {
        onFulfilled(that.value)
      }

      // 当 Promise 内部状态为 reject,则调用then里的回调函数并传递值
      if (that.status === REJECT) {
        onRejected(that.value)
      }
    }
   
    // 自己实现的Promise
    new MyPromise((resolve, reject) => {
      setTimeout(() => {
        resolve(1)
      }, 0)
    }).then(res => {
      console.log(res)
    }, err => {

    })

  

转载于:https://www.cnblogs.com/wilsunson/p/11221619.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值