自己实现一个简单的Promise

自己实现了一个简单的Promise,用来分离开多重的异步嵌套代码,让代码美观好维护。

	var Promise = function(fn){		//任务队列
		this.taskQ = [];
		//添加任务至队列
		if(fn)this.then(fn);
	};
	Promise.prototype = {
		//执行任务
		resolve:function(){
			//队列顶部的任务
			var fn = this.taskQ && this.taskQ[0];
			//存在任务
			if(fn){
				//执行
				var ret = fn.apply(this,arguments);
				//清除任务
				this.taskQ.shift();
				//如果有执行结果,将执行结果作为参数传给下一个任务
				if(ret)
					this.resolve.apply(this,ret);
			}
			return this;
		},
		//添加任务至任务队列
		then:function(fn){
			//过滤不是Function的参数
			if(fn.constructor !== Function)return;
			//添加至队列
			this.taskQ.push(fn);
			//返回this指针,进行链式操作
			return this;
		}
	};

使用如下:


1、在任务中直接调用resolve方法执行下一个任务

var prom = new Promise()
	.then(function(d){
		var r = this;
		console.log("当前第1步,接到任务:" + d);
		
		//do something...
		
		setTimeout(function(){
			var d = "刷牙";
			console.log("第1步完成,传递'" + d + "'任务至下一步");
			r.resolve(1,d);
		},1000);
	})
	.then(function(s,d){
		var r = this;
		console.log("当前第2步,从第" + s + "步接到任务:" + d);
		
		//do something...
		
		setTimeout(function(){
			var d = "洗脸";
			console.log("第2步完成,传递'" + d + "'任务至下一步");
			r.resolve(2,d);
		},1000);
	})
	.then(function(s,d){
		var r = this;
		console.log("当前第3步,从第" + s + "步接到任务:" + d);

		//do something...
		
	});
	prom.resolve("起床");

2、直接返回值,返回值作为参数自动启动下一个任务(下一个任务存在的情况下)

var prom = new promise(function(d){
		console.log("当前第1步,接到任务:" + d);
		return [1,"刷牙"];
	})
	.then(function(s,d){
		console.log("当前第2步,从第" + s + "步接到任务:" + d);
		return [2,"洗脸"];
	})
	.then(function(s,d){
		console.log("当前第3步,从第" + s + "步接到任务:" + d);
	});
	prom.resolve("起床");

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值