promise 实现

本贴最后更新于 1698 天前,其中的信息可能已经时异事殊

思路:
(1) 一个 promise 的当前状态只能是 pending、fulfilled 和 rejected 三种之一。状态改变只能是 pending 到 fulfilled 或者 pending 到 rejected。状态改变不可逆。
(2) promise 的 then 方法接收两个可选参数,表示该 promise 状态改变时的回调(promise.then(onFulfilled, onRejected))。then 方法返回一个 promise。then 方法可以被同一个 promise 调用多次。

// 示例代码
var Promise = (function () {
	// promise 实例 构造函数
	function Promise(resolver) {

		// resolver 必须是一个函数
		if (typeof resolver != 'function') {
			throw new TypeError('Promise resolver is function');
		}

		if (!(this instanceof Promise)) return new Promise(resolver); 

		var self = this;
		self.status = 'pending'; // promise 当前状态
		self.data = undefined; // promisr 的值
		// self.onResolveCallback = []; // resolve
		// self.onRejectCallback = []; // reject
		self.callbacks = []; // resolve and reject

		// resolve
		function resolve(value) {
			setTimeout(() => {
				// 当前状态为pending时
				if (self.status !== 'pending') {
					return;
				}
				self.status = 'resolved';
				self.sata = value;

				for (var i = 0; i < self.callbacks.length; i++) {
					self.callbacks[i].onResolved(value);
				}
			})
		}

		// reject
		function reject(resaon) {
			setTimeout(() => {
				if (self.status !== 'pending') {
					return;
				}
				self.status = 'rejected';
				self.data = resaon;

				for (var i = 0; i < self.callbacks.length; i++) {
					self.callbacks[i].onRejected(resaon);
				}
			})
		}


		// 错误拦截处理
		try {
			executor(resolve, reject);
		} catch(err) {
			reject(err);
		}

	}

	function resolvePromise(promise, x, resolve, reject) {
		var then;
		var thenCalledOrThrow = false;

		if (promise === x) {
			return reject(new TypeError('Chaining cycle deleted for promise'));
		}

		if ((x != null) && (typeof x === 'object') || (typeof x === 'function')) {
			try {
				then = x.then;
				if (typeof then === 'function') {
					then.call(x, function rs(y) {
						if (thenCalledOrThrow) return;
						thenCalledOrThrow = true;
						return resolvePromise(promise, y, resolve, reject);
					}, function rj(r) {
						if (thenCalledOrThrow) return;
						thenCalledOrThrow = true;
						return reject(r);
					});
				} else {
					return resolve(x);
				}
			} catch(err) {
				if (thenCalledOrThrow) return;
				thenCalledOrThrow = true;
				return reject(err);
			}
		} else {
			return resolve(x);
		}
	} 

	// 原型方法
	// then
	Promise.prototype.then = function (onResolved, onRejected) {
		// 性能处理
		onResolved = typeof onResolved === 'function' ? onResolved : function (value) { return value };
		onRejected = typeof onRejected === 'function' ? onRejected : function (resaon) { throw resaon };

		var self = this;
		var promise2;

		
		// 将当前的状态变为resolved
		if (self.status === 'resolved') {
			return promise2 = new Promise(function (resolve, reject) {
				setTimeout(function () {
					try {
						var x = onResolved(self.data);
						resolvePromise(promise2, x, resolve, reject);
					} catch(err) {
						return reject(err);
					}
				});
			});
		};

		// 将当前状态变为rejected
		if (self.status === 'rejected') {
			return promise2 = new Promise(function (resolve, reject) {
				setTimeout(function() {
					try {
						var x = onRejected(self.data);
						resolvePromise(promise2, x, resolve, reject);
					} catch(err) {
						return reject(err);
					}
				})
			});
		};

		// promise状态为pending
		// 需要等待promise的状态完成
		if (self.status === 'pending') {
			return promise2 = new Promise(function (resolve, reject) {
				self.callbacks.push({
					onResolved: function (value) {
						try {
							var x = onResolved(value);
							resolvePromise(promise2, x, resolve, reject);
						} catch (err) {
							return reject(err);
						}
					},
					onRejected: function (resaon) {
						try {
							var x = onRejected(resaon);
							resolvePromise(promise2, x, resolve, reject);
						} catch (err) {
							return reject(err);
						}
					}
				});
			});
		}
	}

	// 将当前promise的值传递
	Promise.prototype.valueOf = function () {
		return this.data;
	}

	// catch
	Promise.prototype.catch = function (onRejected) {
		return this.then(null, onRejected);
	}

	// finally
	Promise.prototype.finally = function (fn) {
		return this.then(function (value) {
			setTimeout(fn);
			return value;
		}, function (resaon) {
			setTimeout(fn);
			throw resaon;
		})
	};

	Promise.prototype.spread = function (fn, onRejected) {
		return this.then(function (values) {
			return fn.apply(null, values);
		}, onRejected);
	};

	Promise.prototype.inject = function (fn, onRejected) {
		return this.then(function (v) {
			return fn.apply(null, fn.toString().match(/\((.*?)\)/)[1].split(',').map(function (key) {
				return v[key];
			}))
		}, onRejected);
	};

	Promise.prototype.delay = function (duration) {
		return this.then(function (value) {
			return new Promise(function (resolve, reject) {
				setTimeout(function () {
					resolve(value);
				}, duration);
			});
		}, function (resaon) {
			return new Promise(function (resolve, reject) {
				setTimeout(function () {
					reject(resaon);
				}, duration);
			});
		});
	};

	// 静态方法
	Promise.all = function (promises) {
		return new Promise(function (resolve, reject) {
			var resolvedCounter = 0;
			var promisesNum = promises.length;
			var resolveValues = new Array(promisesNum);
			for (var i = 0; i < promisesNum; i++) {
				(function (i) {
					Promise.resolve(function (promises) {
						resolvedCounter ++;
						resolveValues[i] = value;
						if (resolvedCounter == promisesNum) {
							return resolve(resolveValues);
						}
					}, function (resaon) {
						reject(resaon);
					})
				})(i);
			};
		});
	}


	Promise.resolve = function (value) {
		return new Promise(function (resolve, reject) {
			resolvePromise(promise, value, resolve, reject);
		});
	};

	Promise.reject = function (resaon) {
		return new Promise(function (resolve, reject) {
			reject(resaon);
		});
	}

	Promise.race = function (promises) {
		return new Promise(function (resolve, reject) {
			for (var i = 0; i < promises.length; i++) {
				Promise.resolve(function () {
					promises[i]
				}).then(function (value) {
					return resolve(value);
				}, function (resaon) {
					return reject(resaon);
				});
			}
		});
	};

	Promise.fcall = function (fn) {
		return Promise.resolve().then(fn);
	}

	Promise.done = Promise.stop = function () {
		return new Promise(function () {});
	}

	Promise.deferred = Promise.defer = function () {
		var dfd = {};
		dfd.promise = new Promise(function (resolve, reject) {
			dfd.resolve = resolve;
			dfd.reject = reject;
		});
		return dfd;
	}

	try {
		module.exports = Promise;
	} catch(err) { }

	return Promise;
});
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    710 引用 • 1173 回帖 • 171 关注

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...

推荐标签 标签

  • Markdown

    Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。

    164 引用 • 1451 回帖
  • SOHO

    为成为自由职业者在家办公而努力吧!

    7 引用 • 55 回帖 • 92 关注
  • JWT

    JWT(JSON Web Token)是一种用于双方之间传递信息的简洁的、安全的表述性声明规范。JWT 作为一个开放的标准(RFC 7519),定义了一种简洁的,自包含的方法用于通信双方之间以 JSON 的形式安全的传递信息。

    20 引用 • 15 回帖 • 21 关注
  • Sandbox

    如果帖子标签含有 Sandbox ,则该帖子会被视为“测试帖”,主要用于测试社区功能,排查 bug 等,该标签下内容不定期进行清理。

    370 引用 • 1215 回帖 • 582 关注
  • 深度学习

    深度学习(Deep Learning)是机器学习的分支,是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    40 引用 • 40 回帖 • 1 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    6560 引用 • 29454 回帖 • 247 关注
  • 创造

    你创造的作品可能会帮助到很多人,如果是开源项目的话就更赞了!

    173 引用 • 990 回帖
  • 域名

    域名(Domain Name),简称域名、网域,是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。

    43 引用 • 208 回帖 • 1 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 512 关注
  • Eclipse

    Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境。

    75 引用 • 258 回帖 • 625 关注
  • 工具

    子曰:“工欲善其事,必先利其器。”

    275 引用 • 682 回帖
  • golang

    Go 语言是 Google 推出的一种全新的编程语言,可以在不损失应用程序性能的情况下降低代码的复杂性。谷歌首席软件工程师罗布派克(Rob Pike)说:我们之所以开发 Go,是因为过去 10 多年间软件开发的难度令人沮丧。Go 是谷歌 2009 发布的第二款编程语言。

    492 引用 • 1383 回帖 • 374 关注
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 125 关注
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 25 关注
  • Quicker

    Quicker 您的指尖工具箱!操作更少,收获更多!

    20 引用 • 74 回帖 • 1 关注
  • Jenkins

    Jenkins 是一套开源的持续集成工具。它提供了非常丰富的插件,让构建、部署、自动化集成项目变得简单易用。

    51 引用 • 37 回帖
  • BND

    BND(Baidu Netdisk Downloader)是一款图形界面的百度网盘不限速下载器,支持 Windows、Linux 和 Mac,详细介绍请看这里

    107 引用 • 1281 回帖 • 25 关注
  • Gzip

    gzip (GNU zip)是 GNU 自由软件的文件压缩程序。我们在 Linux 中经常会用到后缀为 .gz 的文件,它们就是 Gzip 格式的。现今已经成为互联网上使用非常普遍的一种数据压缩格式,或者说一种文件格式。

    9 引用 • 12 回帖 • 112 关注
  • 运维

    互联网运维工作,以服务为中心,以稳定、安全、高效为三个基本点,确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    148 引用 • 257 回帖
  • React

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    192 引用 • 291 回帖 • 443 关注
  • BAE

    百度应用引擎(Baidu App Engine)提供了 PHP、Java、Python 的执行环境,以及云存储、消息服务、云数据库等全面的云服务。它可以让开发者实现自动地部署和管理应用,并且提供动态扩容和负载均衡的运行环境,让开发者不用考虑高成本的运维工作,只需专注于业务逻辑,大大降低了开发者学习和迁移的成本。

    19 引用 • 75 回帖 • 619 关注
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 399 关注
  • Solidity

    Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。

    3 引用 • 18 回帖 • 352 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架,使用 Node.js 编写。

    21 引用 • 140 回帖 • 28 关注
  • etcd

    etcd 是一个分布式、高可用的 key-value 数据存储,专门用于在分布式系统中保存关键数据。

    5 引用 • 26 回帖 • 492 关注
  • 自由行
    1 关注
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件,最早由德国 Innotek 公司开发,由 Sun Microsystems 公司出品的软件,使用 Qt 编写,在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 6 关注