手动实现Promise

Lsnsh 发布于2019-08-20 18:09 / 3240人阅读

摘要：基本原理今天心血来潮，哈哈，就想写个对象，需要说的是，我没有参考谁的代码，也没有去看的源码，当然，我实现的是一个乞丐版的，只有的功能，其中只能抓取一次。设置状态主要作用是确保只能执行其中一个为每个传入的函数包裹错误检查代码

基本原理

今天心血来潮，哈哈，就想写个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
  }
}

GPU云服务器云服务器 jquery_promise实现 promise Promise使用 promise用法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/84132.html

js手动实现promise

摘要：依次循环直到当前没有子如何让异步的在函数中拿到将函数和放入同一个对象对象里面的时候将设置。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果。就算改变已经发生了，你再对对象添加回调函数，也会立即得到这个结果。 let promise = new Promise((resolve111, reject) => { //这里放入我们要执行的函数，可能是同步，也可能是异...

VPointer 2019-08-23 14:37 评论0 收藏0
深入理解Webpack核心模块Tapable钩子[异步版]

摘要：接上一篇文章深入理解核心模块钩子同步版中三个注册方法同步注册的是中对三个触发方法这一章节我们将分别实现异步的版本和版本异步钩子的版本的版本的版本异步的钩子分为并行和串行的钩子，并行是指等待所有并发的异步事件执行之后再执行最终的异步回调。接上一篇文章深入理解Webpack核心模块WTApable钩子(同步版) tapable中三个注册方法 1 tap(同步) 2 tapAsync(...

AlphaWallet 2019-08-23 15:31 评论0 收藏0
异步发展流程 —— Generators + co 让异步更优雅

摘要：遍历器原有的表示集合的数据结构，主要有和，在中又加入了和，这样就有了四种数据集合，还可以组合使用它们，如数组的成员是或，这样就需要一种统一的接口机制，用来处理所有不同的数据结构。 showImg(https://segmentfault.com/img/remote/1460000018998438?w=900&h=431); 阅读原文 Generators 简介 Generato...

dingda 2019-08-23 12:18 评论0 收藏0
fetch使用的常见问题及其解决办法

首先声明一下，本文不是要讲解fetch的具体用法，不清楚的可以参考MDN fetch教程。引言说道fetch就不得不提XMLHttpRequest了，XHR在发送web请求时需要开发者配置相关请求信息和成功后的回调，尽管开发者只关心请求成功后的业务处理，但是也要配置其他繁琐内容，导致配置和调用比较混乱，也不符合关注分离的原则；fetch的出现正是为了解决XHR存在的这些问题。例如下面代码： f...

pubdreamcc 2019-08-20 14:34 评论0 收藏0
深入探析koa之异步回调处理篇

摘要：而之后，我们得到的是一个是一个对象，我们可以使用语句定义回调函数，函数的内容呢，则是将读取到的返回给并继续让从断点处执行。在上一篇中我们梳理了koa当中中间件的洋葱模型执行原理，并实现了一个可以让洋葱模型自动跑起来的流程管理函数。这一篇，我们再来研究一下koa当中异步回调同步化写法的原理，同样的，我们也会实现一个管理函数，是的我们能够通过同步化的写法来写异步回调函数。 1. 回调金字...

Drinkey 2019-08-20 12:24 评论0 收藏0