var PENDING = 0; var FULFILLED = 1; var REJECTED = 2; function Promise() { // store state which can be PENDING, FULFILLED or REJECTED var state = PENDING; // store value or error once FULFILLED or REJECTED var value = null; // store sucess & failure handlers attached by calling .then or .done var handlers = []; }
2、状态变迁
仅支持两种状态变迁，fulfill和reject
// ... function Promise() { // ... function fulfill(result) { state = FULFILLED; value = result; } function reject(error) { state = REJECTED; value = error; } }
fulfill和reject方法较为底层，通常更高级的resolve方法开放给外部。
// ... function Promise() { // ... function resolve(result) { try { var then = getThen(result); if (then) { doResolve(then.bind(result), resolve, reject) return } fulfill(result); } catch (e) { reject(e); } } }
resolve方法可以接受一个普通值或者另一个promise作为参数，如果接受一个promise作为参数，等待其完成。promise不允许被另一个promise fulfill，所以需要开放resolve方法。resolve方法依赖一些帮助方法定义如下:
/** * 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) } }
这里resolve和doResolve之间的递归很巧妙，用来处理promise的层层嵌套（promise的value是一个promise）。
构造器
// ... function Promise(fn) { // ... doResolve(fn, resolve, reject); }
.done方法
// ... function Promise(fn) { // ... function handle(handler) { if (state === PENDING) { handlers.push(handler); } else { if (state === FULFILLED && typeof handler.onFulfilled === 'function') { handler.onFulfilled(value); } if (state === REJECTED && typeof handler.onRejected === 'function') { handler.onRejected(value); } } } this.done = function (onFulfilled, onRejected) { // ensure we are always asynchronous setTimeout(function () { handle({ onFulfilled: onFulfilled, onRejected: onRejected }); }, 0); } // ... }
.then方法
// ... function Promise(fn) { // ... this.then = function (onFulfilled, onRejected) { var self = this; return new Promise(function (resolve, reject) { return self.done(function (result) { if (typeof onFulfilled === 'function') { try { return resolve(onFulfilled(result)); } catch (ex) { return reject(ex); } } else { return resolve(result); } }, function (error) { if (typeof onRejected === 'function') { try { return resolve(onRejected(error)); } catch (ex) { return reject(ex); } } else { return reject(error); } }); }); } // ... }
$.promise
jQuery 1.8 之前的版本，jQuery的 then 方法只是一种可以同时调用 done 、fail 和 progress 这三种回调的速写方法，而 Promises/A 规范的 then 在行为上更像是 jQuery 的 pipe。 jQuery 1.8 修正了这个问题，使 then 成为 pipe 的同义词。不过，由于向后兼容的问题，jQuery 的 Promise 再如何对 Promises/A 示好也不太会招人待见。
此外，在 Promises/A 规范中，由 then 方法生成的 Promise 对象是已执行还是已拒绝，取决于由 then 方法调用的那个回调是返回值还是抛出错误。在 JQuery 的 Promise 对象的回调中抛出错误是个糟糕的主意，因为错误不会被捕获。
小结
最后一个例子揭示了，实现 Promise 的关键是实现好 doResolve 方法，在完事以后触发回调。而为了保证异步 setTimeout(fun, 0); 是关键一步。
Promise 一直用得蛮顺手的，其很好的优化了 NodeJS 异步处理时的代码结构。但是对于其工作原理却有些懵懂和好奇，于是花了些精力查阅并翻译了Promise 的规范，以充分的理解 Promise 的细节。
以上就是关于JavaScript中Promise的使用方法介绍，希望对大家的学习有所帮助。
您可能感兴趣的文章: