一、三种状态
一个简单的异步操作,经过Promise封装,可以使这个操作呈现3种状态:
- 等待态(pending)
比如,正在进行网络请求,或者定时器还没到时间。 - 满足态(fulfil)
主动调回resolve()时,就是该状态,此时会回调then() - 拒绝态(reject)
主动回调reject()时,就是该状态,此时会回调catch()
二、链式使用
现在有个需求:利用异步发送请求,并对收到的数据进行多次处理;
即,网络请求->aaa–>处理aaa111—>处理aaa111.asd---->处理
3次异步处理
new Promise((resolve, reject)=>{
setTimeout( ()={
//请求数据代码...},1000);
if(data){
resolve(data);
}else{
reject("err message: data was not found!");
}
}).then( (data)=>{
//第一次开始...
//进行第一次结果处理...
return new Promise( (resolve) => {
resolve( data+'111'); });
}).then( (data) => {
//第二次开始...
//进行第二次结果处理
return new Promise( (resolve) => {
resolve(data + '.asd'); });
}).then( data => {
//第三次开始...
}).catch( (err)=> {
//处理错误代码...
});
语法糖:
可以把
return new Promise( (resolve) => { resolve( data+'111'); });
简写成:return data + '111';
或 return Promise,resolve(data + '111');
可以把
return Promise.resolve('err');
简写成:
throw "err ";
这样异常还是会被catch到
三、Promise.all()方法
为什么引入all ?
项目开发中,有这么个异步需求:会发送发出2个ajax请求,但必须要等2个请求都完成才能进行下一步的操作,怎么实现?
定义2个boolean,分配给2个请求的执行代码中,然后在外面判断,是否( a1 && a2),随后就开始异步的操作。
但是,这种方法可以被优化,于是Promise提供了all方法
使用实例:
Promise.all([
new Promise( (resolve, reject)=> {
//网络请求a1
setTimeout( ()=>{
resolve('a1') },1000);
}),
new Promise( (resolve, reject)=> {
//网络请求a2
setTimeout( ()=>{
resolve('a2')},2000);
})
]).then( results => console.log(results));
注意:results返回的是 [ ] 数组,里面有2个字符串,分别对应resolve()中的内容