Promise是ES6新特性中知名度非常高的点,我实力不济写的不会很好,如果看官想深入学习Promise请移步其他比较权威的著作,比如阮一峰老师的《ES6入门标准》、《JavaScript Promise迷你书(中文版)》或者直接看"promise/A+"标准也行。我这篇文章的目的只是为我自己备忘而作,当然您也可以略作浏览,难免有所收获嘛!
JavaScript异步编程有四种解决方案:回调函数,事件监听,发布/订阅, Promise;
对,Promise是一种当前非常流行的解决JavaScript异步编程问题的方式。异步直白点说就是不按顺序执行。而Promise会让你在异步编程时有一种同步编程的感觉,同步就是按照顺序一步一步往下执行。
对于Promise,它的API很少,所以你完全可以把这些方法全记住:(Promise是一个对象,就想Array一样)
实例原型上:.then(), .catch(), .finally();
对象属性上:.all(), .race(), .resolve(), .reject();
这些方法除了finally外都会有一个返回值,这个返回值依旧是一个Promise对象,所以我们可以进行链式语法。
Promise对象有且只有三种状态:Pending(进行中),Fulfilled(成功),Rejected(失败);且状态一旦改变就一定不会再次改变。
创建Promise实例:
var promise = new Promise(function(resolve,reject){
//somg code
if(/*异步操作成功*/){
resolve(value);
}else{
reject(error);
}
})
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve和reject。它们是两个JavaScript引擎提供的函数,不用我们自己部署。resolve函数的作用就是将Promise对象由Pending状态改变为Fulfilled状态,在异步操作成功时调用,并将异步操作结果作为参数传递出去。reject函数的作用就是将Promise对象由Pending状态改变为Rejected状态,在异步操作失败时调用,并将异步操作结果作为参数传递出去。
API讲解:
Promise.prototype.then():
该函数在Promise对象从Pending转换成Fulfilled后被调用。它的参数是一个回调函数,这个回调函数的参数是在Promise异步操作成功时传出的参数(创建实例里的value);
举个例子:
new Promise(function(resolve,reject){
console.log("现在正在一步操作中...");
resolve("异步操作成功");
}).then(function(data){
console.log(data);
})
Promise.prototype.catch():
该函数在Promise从Pending转换成Rejected后被调用,它的参数也是一个回调函数,如果异步操作失败、抛出错误,catch()指定的回调函数就会执行,回调函数的参数就是异步操作失败时传出的信息。
举个例子:
new Promise(function(resolve,reject){
throw new Error("异步操作失败");
}).catch(function(error){
console.log(error);
})
Promise.prototype.finally():
finally方法用于指定不管Promise对象最后状态如何都会执行的操作。它接受一个普通的回调函数作为参数,该函数不管怎样都必须执行。
举个例子:
new Promise(function(resolve,reject){
console.log("异步操作中");
resolve();
}).then(function(data){
console.log("成功");
}).catch(function(){
console.log("失败");
}).finally(function(){
console.log("我最后执行的")
})
Promise.all():
Promise.all()方法用于将多个Promise实例包装成一个新的Promise实例。参数是数组之类的具有Iterator接口,且每个成员都是Promise实例的数据结构。
上一段代码:
var P = Promise.all([p1,p2,p3]);
现在p就是有p1,p2,p3三个Promise实例包装而成的一个新Promise实例。且p的状态只有当p1,p2,p3都从Pending变成Fulfilled状态时,才会是Fulfilled,其他情况都是Rejected。
举个例子:
var promises = [1,2,3].map(item=>{
return Promise.resolve(item);//下文讲解
});
Promise.all(promises).then(function(data){
console.log(data);
}).catch(function(error){
console.log(error);
})
Promise.race():
Promise.race()方法和Promise.all()方法很相近,只有一点不同:当p1,p2,p3中有一个实例的状态改变,p的状态就会改变,那个率先改变的Promise实例的返回值就是传递给p的回调函数的参数值。
Promise.resolve():
它的作用就是将现有对象转变成Promise对象,且转变成的Promise对象是Fulfilled状态。现有对象可以是Promise对象也可以普通其他对象。
Promise.reject():
该方法和Promise.resolve()的作用一样,只不过是转变成Rejected状态的Promise对象就这样简单总结一下Promise,把这篇文章当做学习Promise的目录是不错的选择。更加详细的内容请看官自行研究。