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

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. back

    #include<stdio.h>   int main()   {   int a[5],b[5][5];   int i,j,sum,max,m,n;   printf("输 ...

  2. [2017BUAA软工]个人项目

    软工个人项目 一.Github项目地址 https://github.com/Lydia-yang/2017BUAA-SoftwareEngineering 二.解题思路 在刚开始拿到题目的时候,关于 ...

  3. Integrating Jenkins and Apache Tomcat for Continuous Deployment

    Installation via Maven WAR Overlay - Jenkins - Jenkins Wikihttps://wiki.jenkins.io/display/JENKINS/I ...

  4. Java与JavaScript之间关于JSON的是非恩怨

    http://blog.csdn.net/joyhen/article/details/43271569 js 单引号替换成双引号,双引号替换成单引号 操作 解决问题的场景: Java端生成了JSON ...

  5. mysql的group_concat对应oracle的wm_concat

    mysql的group_concat对应oracle的wm_concat http://bey2nd.blog.163.com/blog/static/12063183120124313360964/

  6. WIN10护眼色

    参看文章:http://www.xitongcheng.com/jiaocheng/win10_article_10326.html WIN10:[HKEY_CURRENT_USER\Control ...

  7. selenium之批量执行测试用例生成HTML结果文件

    使用HTMLTestRunner运行测试套件,自动生成html测试报告: import unittest, HTMLTestRunner, sendmail_html import time, os ...

  8. python 惰性求值 https://blog.csdn.net/Appleyk/article/details/77334221

    为什么调用的不是同一个函数呢 是因为调用函数后,函数的生命周期就结束了,再调用就是另一个函数了

  9. CF1037D Valid BFS?

    Valid BFS? CodeForces - 1037D The BFS algorithm is defined as follows. Consider an undirected graph ...

  10. 使用libcurl 发送post请求

    SendHttpPost(string& strUrl, string& strPost, string& strResponse, int nTimeOut) { CURLc ...