ES6——Promise对象

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u012194956/article/details/79505643

本文参考公众号: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对象的最后状态如何,都会执行的操作,接收一个普通回调函数作为参数,该函数不管怎样都会执行

猜你喜欢

转载自blog.csdn.net/u012194956/article/details/79505643