ES6——Promise对象

本文参考公众号：web前端教程

首先来看一下没有Promise时经常出现的一个回调：

//请求A开始
$.ajax(
	success:function(res1){
		//请求B开始
		$.ajax(
			success:function(res2){
				//请求C开始
				$.ajax(
					success:function(res3){

				});
				//请求C结束
		});
		//请求B结束
});
//请求A结束

上面的案例：假设请求C需要依赖请求B返回的数据，所以，C只能放在B的success函数内；B需要依赖A请求得到的数据作为参数，所以B只能放在A的success函数内。那么请求的顺序应该为：请求A->请求B->请求C。

上述写法的不足：

（1）如果存在多个请求层层依赖，嵌套太多，会导致代码可读性差，不直观，调试起来也不方便，不利于后期维护

（2）如果C依赖于A和B的结果，然而A和B相互独立，那么B就必须等到A请求完成之后才能执行，消耗了更多的等待时间

对于上述回调函数层层嵌套（回调地狱）的形式存在的缺点，ES6的Promise对象可以完美解决。

由此，Promise对象能使我们更合理、更规范地进行处理异步操作。

Promise对象介绍：

Promise对象是全局对象，你可以理解成一个类，创建Promise实例的时候，要用到关键字new，参数是一个匿名函数，且匿名函数的参数分别为resolve和reject（这两个参数均为方法），其中resolve方法用于处理异步操作成功后业务，reject用于处理异步操作失败后业务。

var pro=new Promise(function(resolve,reject){
	
})

Promise对象有三个状态：

• pending：刚创建一个Promise对象实例的时候，表示初始状态
• fulfilled：resolve方法调用的时候，表示操作成功
• rejected：reject方法调用的时候，表示操作失败

注：如果一个promise对象没有在等待中（处于已解决或已拒绝），那么它就是settled（已解决）的。

Promise属性：

 

• Promise.length：其值总为1（构造器参数的数目）
• Promise.prototype

上述案例的Promise解决方法：

var pro=new Promise(function(resolve,reject){
	//实例化后状态：pending
	if(true){
		//调用操作成功方法
		resolve('操作成功');
	}else{
		//调用操作失败方法
		reject('操作异常');
	}
});

//用then处理操作成功，catch处理操作异常
pro.then(requestA)
	.then(requestB)
	.then(requestC)
	.catch(requestError);

function requestA(){
	console.log('请求A成功');
	return '请求B，下一个就是你了';
}
function requestB(res){
	console.log('上一步的结果：'+res);
	console.log('请求B成功');
	return '请求C，下一个就是你了';
}
function requestC(res){
	console.log('上一步的结果：'+res);
	console.log('请求B成功');
}
function requestError(){
	console.log('请求失败');
}

打印结果：

 

 

Promise对象的方法：

• then()：用于绑定处理操作后的处理程序。参数是两个函数，第一个用于处理操作成功后的业务，第二个用于处理操作异常后的的业务。返回Promise对象
• catch()：用于处理操作异常后的业务，只接受一个参数。返回Promise对象。
• all()：接受一个数组作为参数，数组的元素是Promise实例，当参数的实例对象的状态都是fulfilled时，Promise.all()才会有返回。通常用于这样的场景：我们执行某个操作，这个操作需要得到多个接口返回的数据来支持，但是这些接口之间互不依赖，不需要层层嵌套
• race()：参数与all()一样，不同的是返回，只要参数中有一个状态发生变化（不管是resolved还是rejected），它就会有返回。
• resolve()：将现有对象转化为Promise对象
• reject()：同上。

两个有用的附加方法：

 

• done()：总是处于回调链的尾端，保证向全局抛出任何可能出现的错误，用法同then
• finally()：用于指定不论Promise对象的最后状态如何，都会执行的操作，接收一个普通回调函数作为参数，该函数不管怎样都会执行