手写promise及测试

<script>
	class MyPromise {
		static PENDING = "pending";
		static FULFILLED = "fulfilled";
		static REJECTED = "rejected";
		constructor(executor) {
			//状态
			this.state = MyPromise.PENDING ;
			//成功时的返回值
			this.value = null;
			//失败信息
			this.reason = null;
			//存储异步操作
			this.onResolvedCallbacks = [];
			this.onRejectedCallbacks = [];
			let resolve = (value) => {
				if(this.state === MyPromise.PENDING){
					this.state = MyPromise.FULFILLED;
					this.value = value;
					this.onResolvedCallbacks.forEach(fn => fn());
				}
			};
			let reject = (reason) => {
				if(this.state === MyPromise.PENDING){
					this.state = MyPromise.REJECTED ;
					this.reason= reason;
					this.onResolvedCallbacks.forEach(fn => fn());
				}
			};
			try{
				executor(resolve,reject);
			}catch(err){
				rejected(err);
			}
		}
		then(onFulfilled,onRejected) {// 成功回调  失败回调
			onFulfilled = typeof onFulfilled === "function" ? onFulfilled:(value)=> value;
			onRejected = typeof onRejected === "function" ? onRejected:(err)=> throw err;
			let promise2 = new MyPromise((resolve,reject)=>{
				if(this.state === MyPromise.FULFILLED){
					setTimeout(()=>{
						try{
							let res = onFulfilled(this.value);
							resovlePromise(promise2,res,resolve,reject);
						}catch(err){
							reject(err);
						}
					},0);
				}
				if(this.state === MyPromise.REJECTED){
					setTimeout(()=>{
						try{
							let res = onRejected(this.reason);
							resovlePromise(promise2,res,resolve,reject);
						}catch(err){
							reject(err);
						}
					},0);
				}
				//处理异步 采用发布订阅者模式
				if(this.state === MyPromise.PENDING){
					this.onResolvedCallbacks.push(()=>{
						setTimeout(()=>{
							try{
								let res = onFulfilled(this.value);
								resovlePromise(promise2,res,resolve,reject);
							}catch(err){
								reject(err);
							}
						},0);
					});
					this.onRejectedCallbacks.push(()=>{
						setTimeout(()=>{
							try{
								let res = onRejected(this.reason);
								resovlePromise(promise2,res,resolve,reject);
							}catch(err){
								reject(err);
							}
						},0);
					});
				}
			});
			return promise2;
		}
		catch(fn) {
			return this.then(null,fn);
		}
	}
	//then回调方法 类型判断 func为成功或失败回调
	function resovlePromise(promise2,func,resolve,reject) {
		if(func === promise2){
			return reject(new TypeError("chaining cycle detected for promise"));
		}
		let called;
		if(func !== null && (typeof func === "object" || typeof func === "function")){
			//当then回调方法的返回值为promise的时候执行
			try{
				let then = func.then;
				if(typeof then === "function"){
					then.call(func,(s)=>{
						if(called)return;
						called = true;
						resovlePromise(promise2,s,resolve,reject);
					},(e)=>{
						if(called)return;
						called = true;
						reject(e);
					})
				}else{
					resolve(func);
				}
			}catch(err){
				if(called)return;
				called = true;
				reject(err)
			}
		}else {
			resolve(func);
		}
	}
	//测试
	new MyPromise((resolve,reject)=>{
		console.log("111");
		setTimeout(()=>{
			resolve("成功1");
		},2000);
	}).then(res => {
		console(res);
		return new MyPromise((resolve,reject)=>{
			setTimeout(()=>{
				resolve("成功2");
			},2000);
		});
	},err => {
		console(err);
	}).then(res => {
		console(res);
	},err => {
		console(err);
	});
</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值