Promise用途
Promise是异步编程的一种解决方案,可以用来解决JavaScript中回调嵌套过多导致的回调地狱(callbackhell)而产生的。你可以将Promise当做一个容器,里面保存着某个未来才会结束的事件(通常为异步操作)的结果。从语法上说Promise是一个对象,可以通过其提供的统一的API来获取异步操作的消息。
创建一个new Promise
const promise = new Promise(function(resolve,reject){
//code
if(/*异步操作成功*/){
resolve(value);
} else{
reject(error);
}
});
Promise.prototype.then的使用
Promise实例具有then方法,它的作用是为Promise实例添加状态改变时的回调函数。then的第一个参数是resolved状态的回调函数,第二个参数(可选)是rejected状态的回调函数。then方法返回的是一个新的Promise实例!因此可以采用链式写法。
语法:
p.then(onFulfilled[,onRejected]);
p.then(value=>{
//fulfillment
},reason=>{
//rejection
});
简单示例
const promise1 = new Promise((resolve,reject)=>{
resolve('成功!');
});
promise1.then((value)=>{
console.log(value);
});
onFulfilled(可选):当Promise变成接受(fulfilled)状态时调用的函数
onRejected(可选):当Promise变成拒绝状态(rejected)时调用的函数
链式用法
Promise.resolve("www")
//接受"www"并且和".2demo"合并,并将结果作为下一个resolved返回
.then(function(string){
return new Promise(function(resolve,reject){
setTimeout(function(){
string+='.2demo';
resolve(string);
},2000);
});
})
//接受"www.2demo",放入到一个异步函数中处理该字符并将其打印至控制台,但是不将处理后的字符串返回下一个
.then(function(string){
setTimeout(function(){
string +=".top";
console.log(string);
},5000);
return string;
})
//接受上一个回调函数处理前的字符串,并且打印帮助理解
.then(function(string) {
console.log("这句话会2s后出现")
console.log(string+"这句话中没有.top");
});
Promise.all 的使用
Promise.all是将多个Promise实例包装成一个新的Promise实例
const p = Promise.all([p1,p2,p3])
Promise.all方法接受一个Promise的iterable类型(Array,Map,Set都属于ES6的iterable了下)的输入,输入的说有Promise的resolve的回调结果都是一个数组,这个Promise的resolve回调执行需所有输入的Promise的resolve回调结束或者输入的iterable里不含Promise的时候。它的reject回调执行只需要任何一个输入的Promise的reject回调执行或者输入不合法就会立即抛出错误,且reject的是第一个抛出的错误
上面代码中Promise.all()接受一个数组作为参数,p1,p2,p3都是Promise实例
简单示例
const p1= Promise.resolve(23);
const p2= 41;
const p3 =new Promise((resolve,reject)=>{
setTimeout(resolve,1000,"2demo")
});
Promise.all([p1,p2,p3]).then((values)=>{console.log(values)})
Promise.race 的使用
Promise.race用法和Promise.race类似,也是将多个实例包装成一个新的Promise实例
const p = Promise.race([p1,p2,p3])
与Promise.all不同的是Promise.race只要一个实例率先改变状态那么p的状态就跟着改变,率先改变的Promise实例的返回值就会传递给P的回调函数。
Promise.race方法的参数与Promise.all相同
简单示例:
const p1=new Promise((resolve,reject)=>{
setTimeout(resolve,1000,"第一个实例")
});
const p2 = new Promise((resolve,reject)=>{
setTimeout(resolve,300,"第二个实例")
});
Promise.race([p1,p2]).then((values)=>{console.log(values)});