Promise实现原理
这两天在熟悉 kissy 框架的时候，看到了
Promise模块。Promise对于一个Jser并不陌生，Promise相似于一个事务管理器，它的做用就是将各类内嵌回调的事务用流水形式表达。利用Promise可让异步编程更符合人的直觉，让代码逻辑更加清晰，把开发人员从回调地狱中释放出来。这么“高大上”的东西，之前写nodejs代码的时候只是简单的用用，尚未理解其基本的实现原理，罪过！我的认为，理解编程思想最好的途径就是阅读一份简易的实现源码。很幸运，网上有很多Promise的简易实现，其中 这篇博文 介绍的实现方式很是赞，下面就来好好研究下吧！javascript
基础概念
目前， Promise 是 ECMAScript 6 规范的重要特性之一，各大浏览器也开始慢慢支持这一特性。固然，也有一些第三方内库实现了该功能，如： Q 、 when 、 WinJS 、 RSVP.js 等。html
Promise 对象用来进行延迟( deferred )和异步( asynchronous )计算。一个 Promise 处于如下四种状态之一:前端
- pending: 尚未获得确定或者失败结果，进行中
- fulfilled: 成功的操做
- rejected: 失败的操做
- settled: 已被
fulfilled或rejected
Promise 对象有两个重要的方法，一个是 then ，另外一个是 resolve ：html5
- then：将事务添加到事务队列中
- resolve：开启流程，让整个操做从第一个事务开始执行
Promise 经常使用方式以下：java
var p = new Promise(function(resolve, reject) { ... // 事务触发 resovle(xxx); ... }); p.then(function(value) { // 知足 }, function(reason) { // 拒绝 }).then().then()...
示意图以下：node
实现步骤
1. Promise 其实就是一个状态机。按照它的定义，咱们可从以下基础代码开始：git
var PENDING = 0; // 进行中 var FULFILLED = 1; // 成功 var REJECTED = 2; // 失败 function Promise() { // 存储PENDING, FULFILLED或者REJECTED的状态 var state = PENDING; // 存储成功或失败的结果值 var value = null; // 存储成功或失败的处理程序，经过调用`.then`或者`.done`方法 var handlers = []; // 成功状态变化 function fulfill(result) { state = FULFILLED; value = result; } // 失败状态变化 function reject(error) { state = REJECTED; value = error; } }
2.下面是 Promise 的 resolve 方法实现：es6
注意： resolve 方法可接收的参数有两种：一个普通的值/对象或者一个 Promise 对象。若是是普通的值/对象，则直接把结果传递到下一个对象；若是是一个 Promise 对象，则必须先等待这个子任务序列完成。github
function Promise() { ... function resolve(result) { try { var then = getThen(result); // 若是是一个promise对象 if (then) { doResolve(then.bind(result), resolve, reject); return; } // 修改状态，传递结果到下一个事务 fulfill(result); } catch (e) { reject(e); } } }
两个辅助方法：编程
/** * Check if a value is a Promise and, if it is, * return the `then` method of that promise. * * @param {Promise|Any} value * @return {Function|Null} */ function getThen(value) { var t = typeof value; if (value && (t === 'object' || t === 'function')) { var then = value.then; if (typeof then === 'function') { return then; } } return null; } /** * Take a potentially misbehaving resolver function and make sure * onFulfilled and onRejected are only called once. * * Makes no guarantees about asynchrony. * * @param {Function} fn A resolver function that may not be trusted * @param {Function} onFulfilled * @param {Function} onRejected */ function doResolve(fn, onFulfilled, onRejected) { var done = false; try { fn(function(value) { if (done) return; done = true; onFulfilled(value); }, function(reason) { if (done) return; done = true; onRejected(reason); }); } catch(ex) { if (done) return; done = true; onRejected(ex); } }
3.上面已经完成了一个完整的内部状态机，但咱们并无暴露一个方法去解析或则观察 Promise 。如今让咱们开始解析 Promise：
function Promise(fn) { ... doResolve(fn, resolve, reject); }
如你所见，咱们复用了 doResolve ，由于对于初始化的 fn 也要对其进行控制。 fn 容许调用 resolve 或则 reject 屡次，甚至抛出异常。这彻底取决于咱们去保证 promise 对象仅被 resolved 或则 rejected 一次，且状态不能随意改变。
4.目前，咱们已经有了一个完整的状态机，但咱们仍然没有办法去观察它的任何变化。咱们最终的目标是实现 then 方法，但 done方法彷佛更简单，因此让咱们先实现它。
咱们的目标是实现 promise.done(onFullfilled, onRejected) ：
onFulfilled和onRejected二者只能有一个被执行，且执行次数为一- 该方法仅能被调用一次
- 一旦调用了该方法，则
promise链式调用结束 - 不管是否
promise已经被解析，均可以调用该方法
var PENDING = 0; // 进行中 var FULFILLED = 1; // 成功 var REJECTED = 2; // 失败 function Promise() { // 存储PENDING, FULFILLED或者REJECTED的状态 var state = PENDING; // 存储成功或失败的结果值 var value = null; // 存储成功或失败的处理程序，经过调用`.then`或者`.done`方法 var handlers = []; // 成功状态变化 function fulfill(result) { state = FULFILLED; value = result; handlers.forEach(handle); handlers = null; } // 失败状态变化 function reject(error) { state = REJECTED; value = error; handlers.forEach(handle); handlers = null; } function resolve(result) { try { var then = getThen(result); if (then) { doResolve(then.bind(result), resolve, reject) return } fulfill(result); } catch (e) { reject(e); } } // 不一样状态，进行不一样的处理 function handle(handler) { if (state === PENDING) { handlers.push(handler); } else { if (state === FULFILLED && typeof handler.onFulfilled === 'function') { handler.onFulfilled(value); }