promise
- 用来管理异步操作的工具,new Promise(function(resolve,reject){})
- Promise后面.then创建的是微任务
new Promise(function(resolve,reject){
//操作一
let a=0;
if(a==0){
resolve(111);//放行,有这个.then里面的才会执行
}else{
reject("异常信息1");//用于异常时禁止.then执行,执行.catch
}
}).then(function(e){
new Promise(function(resolve,reject){
//异步操作二
resolve(222);
}).then(function(e){
//异步操作三
})
}).catch(function(e){
console.log(e);
}).finally(function(){
console.log("完成了")
})
- reject()和resolve()不能同时执行,不同条件执行不同结果
- 参数resolve,
控制.then的执不执行,没写resolve,then就不执行 - 参数reject,
reject()小阔号里放异常处理的信息,有reject后面没有.catch则会报错 - .then()方法
then(function(e){})这里的e就是resolve()小括号里传过来的参数 - catch()方法,
小括号里面放函数,在reject()触发后,catch就会执行,其他情况不会执行
.catch(function(e){})这里的e就是reject()小括号里传过来的参数 - .finally()方法,
不管Promise中放行还是异常,都会执行,一般放在最后当做收尾执行的
.then里面有两个函数,不用写catch
new Promise(function(resolve,reject){
let a = 1;
if(a==0){
resolve("正常");
}else{
reject("异常")
}
}).then(function(val1){
console.log(va1l)
},function(val2){
console.log(val2)
})
- 当then里面参数是两个函数时,第一个函数里的形参是resolve()里的值,第二个函数里的形参是reject()里的值
- 当then里面只有一个函数时,有reject后面没有.catch则会报错
多个then时
- 这两种写法的含义是不同的,所以一个用的resolve,一个用的return
Promise.all()
- 用于管理多个promise对象确保处理完毕,再通过返回值执行不同操作
let p1 = new Promise(function(resolve){
resolve("111");
}).then(function(val){
return 444;
}).then(function(val){
return 555;
})
let p2 = new Promise(function(resolve){
resolve("222");
})
let p3 = new Promise(function(resolve){
resolve("333");
})
Promise.all([p1,p2,p3]).then(function(val){
console.log(...val);//结果是555 222 333
})
通过Promise.all()获取到所有的promise对象的返回值,
- Promise.all([a,b,c]).then(function(val){})里面的val以数组的形式存着每个promise对象a,b,c最后的返回值
- 当你获取的所有对象返回值中有一个是错误reject的返回值,那就只有这一个值,其他正确的值不会获取
- 有多个错误reject的返回值,只获取那个最早reject的返回值
Promise.race()
let p1 = new Promise(function(resolve){
resolve("111");
}).then(function(val){
return 444;
}).then(function(val){
return 555;
})
let p2 = new Promise(function(resolve){
resolve("222");
})
let p3 = new Promise(function(resolve){
resolve("333");
})
Promise.race([p1,p2,p3]).then(function(val){
console.log(val);//结果是222
})
- 这里面的val为最先执行完的Promise对象的返回值
- 通过Promise.race()获取到最先完成的promise对象的返回值,不管正常resolve还是异常reject都是获取最早的返回值
- 当返回值是同时的时候,按race([])里面书写的顺序来获取返回值
let p1 = new Promise(function(resolve){
resolve("111");
}).then(function(val){
return 444;
}).then(function(val){
return 555;
})
let p2 = new Promise(function(resolve){
resolve("222");
})
let p3 = new Promise(function(resolve){
resolve("333");
})
Promise.race([p1,p3,p2]).then(function(val){
console.log(val);//这里的结果就是333
})
- 因为p2和p3时同时获得返回值的,但是在race中的顺序是p3在前,所以结果是p3的返回值
ES7新增方法
async和await
- async修饰的函数专门用于管理异步操作的执行顺序
- await必须写在async修饰的函数里面
- await修饰的promise对象只有在上一个promise对象执行完毕(reject或resolve)才会执行,否则一直等待
async function fn1(){
await new Promise(function(resolve,reject){
setTimeout(function(){
console.log("111");
resolve();
},500)
})
await new Promise(function(resolve,reject){
setTimeout(function(){
console.log("222");
resolve();
},300)
})
await new Promise(function(resolve,reject){
setTimeout(function(){
console.log("333");
resolve();
},400)
})
await new Promise(function(resolve,reject){
setTimeout(function(){
console.log("444");
resolve();
},100)
})
}
fn1();//结果111 222 333 444
利用这个方法获取全部promise对象的返回值,作用与promise.all()一样
async function fn(){
let a = await new Promise(function(resolve,reject){
setTimeout(() => {
console.log("张三");
resolve(11);
}, 500);
})
let b = await new Promise(function(resolve,reject){
setTimeout(() => {
console.log("李四");
resolve(22);
}, 400);
})
let c = await new Promise(function(resolve,reject){
setTimeout(() => {
console.log("王五");
reject(33);
}, 300);
}).catch(function(v){
console.log(v);
return v;
})
let d = await new Promise(function(resolve,reject){
setTimeout(() => {
console.log("赵六");
resolve(44);
}, 300);
})
return [a,b,c,d]
}
let p = fn();
p.then(function(val){
console.log(val);
},function(val){
console.log(val);
})