手动完成Promise

基本原理

本日心血来潮,哈哈,就想写个promise对象,须要说的是,我没有参考谁的代码,也没有去看promise的源码,固然,我完成的是一个托钵人版的promise,只要then & catch 的功用,个中catch只能抓取一次。仅供大伙空闲看看,打发下时候。代码解释简朴说了下,以下:

import _ from 'lodash'

var compose = _.flowRight

class Xpromise {
  constructor(f) {
    this._value = f.bind(undefined, this.resolve, this.reject) // 为传入的 函数 绑定resolve & reject 要领
    this.chain = undefined // 把then传入的要领 经由过程compose 处理成链式挪用
    this.errFunc = [] // 把catch 传入的要领
    setTimeout( () => { // 假如new 一个新的对象,传入的函数不是异步的,则chain & errFunc 拿不到就实行了。所以运用定时器延时实行。
      this.errHandle(this._value)()
    }, 0)
    this.status = 'pending' // 设置Xpromise 状况 重要作用是 确保resolve & reject只能实行个中一个
    return this
  }
  resolve = (data) => {
    if(this.status == 'pending')
      this.status = 'resolved'
    this.status == 'resolved' && this.chain && this.chain(data)
  }
  reject = (data) => {
    if(this.status == 'pending')
      this.status = 'rejected'

    this.status = 'rejected' && this.errFunc[0](data)
  }
  then = (f) => {
    this.chain = this.chain? compose(this.errHandle(f), this.chain): this.errHandle(f)
    return this
  }
  errHandle = (f) => {// 为每一个传入的函数包裹 毛病搜检 代码
    return function() {
      var args = Array.prototype.slice.call(arguments, 0)
      try{
        return f.apply(f,args)
      }catch(e){
        if(this.errFunc.length !== 0)
          this.errFunc[0](e)
        else
          throw new Error(e)

        return
      }
    }
  }
  catch = (f) => {
    this.errFunc.push(f)
    return this
  }
}
    原文作者:小乔流水乔
    原文地址: https://segmentfault.com/a/1190000010259995
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞