废话不多说,直接上代码:

class myPromise {
constructor(fn) {
this.status = 'pending';
this.resolveCbs = [];
this.rejectCbs = [];
this.value = null;
fn(this._resolve.bind(this), this._reject.bind(this));
return this;
}
_resolve(val) {
if (this.status === 'pending') {
this.value = val;
this.status = 'fulfilled';
this.resolveCbs.forEach(cb => {
cb(this.value);
})
}
}
_reject(err) {
if (this.status === 'pending') {
this.value = err;
this.status = 'rejected';
this.rejectCbs.forEach(cb => {
cb(this.value);
})
// 如果没有处理函数,则直接抛错
if (this.rejectCbs.length === 0) {
throw err
}
}
}
then(resolveCb, rejectCb) {
if (this.status !== 'pending') {
const cb = this.status === 'fulfilled' ? resolveCb : rejectCb;
const self = new myPromise((resolve, reject) => {
this._handleCb(cb, this.value, resolve, reject, self);
})
return self;
} else {
const self = new myPromise((resolve, reject) => {
if (typeof resolveCb === 'function') {
this.resolveCbs.push(res => {
this._handleCb(resolveCb, res, resolve, reject, self);
})
}
if (typeof rejectCb === 'function') {
this.rejectCbs.push(res => {
this._handleCb(rejectCb, res, resolve, reject, self);
})
}
})
return self;
}
}
catch(rejectCb) {
return this.then(null, rejectCb)
}
_handleCb(cb, res, resolve, reject, self) {
try {
const ret = cb(res)
if (ret instanceof Promise || ret instanceof myPromise) {
if (ret === self) {
throw new Error('检测到myPromise链式循环')
}
ret.then(res => resolve(res))
} else {
resolve(ret)
}
} catch (err) {
reject(err)
}
}
}
new myPromise((resolve, reject) => {
setTimeout(() => {
resolve(456)
}, 1000);
}).then(res => {
console.log(res)
throw 'hualala'
}).catch(err => {
console.log('heng!!!')
return new myPromise((resolve, reject) => {
setTimeout(() => {
reject(233)
}, 1000);
})
}).then(res => {
console.log(res)
})

这个简版的Promise已经可以实现到链式的地步了, 如果return是一个非Promise,则直接resolve,如果是Promise,则等then再resolve

 

自己的Promise的更多相关文章

  1. Javascript - Promise学习笔记

    最近工作轻松了点,想起了以前总是看到的一个单词promise,于是耐心下来学习了一下.   一:Promise是什么?为什么会有这个东西? 首先说明,Promise是为了解决javascript异步编 ...

  2. 路由的Resolve机制(需要了解promise)

    angular的resovle机制,实际上是应用了promise,在进入特定的路由之前给我们一个做预处理的机会 1.在进入这个路由之前先懒加载对应的 .js $stateProvider .state ...

  3. angular2系列教程(七)Injectable、Promise、Interface、使用服务

    今天我们要讲的ng2的service这个概念,和ng1一样,service通常用于发送http请求,但其实你可以在里面封装任何你想封装的方法,有时候控制器之间的通讯也是依靠service来完成的,让我 ...

  4. 闲话Promise机制

    Promise的诞生与Javascript中异步编程息息相关,js中异步编程主要指的是setTimout/setInterval.DOM事件机制.ajax,通过传入回调函数实现控制反转.异步编程为js ...

  5. 深入理解jQuery、Angular、node中的Promise

    最初遇到Promise是在jQuery中,在jQuery1.5版本中引入了Deferred Object,这个异步队列模块用于实现异步任务和回调函数的解耦.为ajax模块.队列模块.ready事件提供 ...

  6. Promise的前世今生和妙用技巧

    浏览器事件模型和回调机制 JavaScript作为单线程运行于浏览器之中,这是每本JavaScript教科书中都会被提到的.同时出于对UI线程操作的安全性考虑,JavaScript和UI线程也处于同一 ...

  7. JavaScript进阶之路——认识和使用Promise,重构你的Js代码

    一转眼,这2015年上半年就过去了,差不多一个月没有写博客了,"罪过罪过"啊~~.进入了七月份,也就意味着我们上半年苦逼的单身生活结束了,从此刻起,我们要打起十二分的精神,开始下半 ...

  8. 细说Promise

    一.前言 JavaScript是单线程的,固,一次只能执行一个任务,当有一个任务耗时很长时,后面的任务就必须等待.那么,有什么办法,可以解决这类问题呢?(抛开WebWorker不谈),那就是让代码异步 ...

  9. 浅谈Angular的 $q, defer, promise

    浅谈Angular的 $q, defer, promise 时间 2016-01-13 00:28:00  博客园-原创精华区 原文  http://www.cnblogs.com/big-snow/ ...

  10. angular学习笔记(二十八-附2)-$http,$resource中的promise对象

    下面这种promise的用法,我从第一篇$http笔记到$resource笔记中,一直都有用到: HttpREST.factory('cardResource',function($resource) ...

随机推荐

  1. StringBuffer的append方法比“+”高效

    在字符串的连接过程中StringBuffer的效率要比String高: string操作代码: String str = new String("welcome to "); st ...

  2. 北京大学信息科学技术学院本科生课程体系课程大纲选登——计算机网络与WEB技术

  3. [2017BUAA软工]第0次博客作业

    第一部分:结缘计算机 1.你为什么选择计算机专业?你认为你的条件如何?和这些博主比呢? 当初选择计算机专业作为自己报考大学的第一志愿,主要是看重了市场对于计算机行业人士的巨大需求,同时也感慨于计算机行 ...

  4. vue原理探索--响应式系统

    Vue.js 是一款 MVVM 框架,数据模型仅仅是普通的 JavaScript 对象,但是对这些对象进行操作时,却能影响对应视图,它的核心实现就是「响应式系统」. 首先看一下 Object.defi ...

  5. sql 表,字段(列),表数据(行)相关命令

    随便转载,保留出处:http://www.cnblogs.com/aaron-agu/ 注: 以下所有操作都在登陆数据库后执行 命令use test;  test为数据库名 查看表 show tabl ...

  6. Flask-sqlacodegen

    ORM操作有两种方式. 1.模型迁移到数据库中生成表,codefirst:使用flask-migrate: 需要flask-script: from flask_script import Manag ...

  7. BZOJ3298[USACO 2011Open]cow checkers——威佐夫博弈

    题目描述 一天,Besssie准备和FJ挑战奶牛跳棋游戏.这个游戏上在一个M*N的棋盘上, 这个棋盘上在(x,y)(0<=x棋盘的左下角是(0,0)坐标,棋盘的右上角是坐标(M-1,N-1). ...

  8. LOJ115 无源汇有上下界可行流(上下界网络流)

    假设初始流为每条边的下界.但这样可能流量会不守恒,我们需要在上面加上一个附加流使流量守恒.只要让每个点开始的出/入流量与原初始流相等就可以求出附加流了.那么新建超源S超汇T,令degree[i]表示流 ...

  9. jquery 取id模糊查询

    [属性名称] 匹配包含给定属性的元素[att=value] 匹配包含给定属性的元素 (大小写区分)[att*=value] 模糊匹配[att!=value] 不能是这个值[att$=value] 结尾 ...

  10. bzoj2142: 礼物

    2142: 礼物 Description 一年一度的圣诞节快要来到了.每年的圣诞节小E都会收到许多礼物,当然他也会送出许多礼物.不同的人物在小E心目中的重要性不同,在小E心中分量越重的人,收到的礼物会 ...