Promise的构造函数接收一个参数，是函数，并且传入两个参数：resolve，reject，分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。
1.模拟同步加载，比如两个ajax请求，需求是ajax1执行完拿到数据后才能执行ajax2，这里我就用setTimeout来表示ajax。
一般的处理方式是
var ajax1=setTimeout(()=>{
console.log( "ajax1回调了,发起ajax2请求 ");
var ajax2=setTimeout(()=>{
console.log( "ajax2回调了，发起ajax3请求" );
var ajax3=setTimeout(()=>{
console.log( "ajax3的回调执行了" );
},1000)
},1000)
},1000)
用promise实现
new Promise(( resolve,reject )=>{
setTimeout(()=>{
console.log( "ajax1回调了,开始调用ajax2的请求函数 ");
resolve("哈哈哈哈我是ajax1请求回来的数据");
})
})
.then((res)=>{
return new Promise(( resolve,reject )=>{
console.log("ajax1传过来的参数="+res);
setTimeout(()=>{
console.log( "ajax2回调了,开始调用ajax3的请求函数 ");
resolve("哈哈哈哈我是ajax2请求回来的数据");
})
})
})
.then((res)=>{
return new Promise(( resolve,reject )=>{
console.log("ajax2传过来的参数="+res);
setTimeout(()=>{
console.log( "ajax3回调了");
reject("ajax3回调拿到的参数为null，我要报异常");
})
})
})
.catch((err)=>{
console.log(err);
});
代码多的话两种方式的可读性就很明显了。
2.并行加载，可以让几个函数“并行”异步加载，一起回调。
Promise.all 接收一个 promise对象的数组作为参数，当这个数组里的所有promise对象全部变为resolve或reject状态的时候，它才会去调用 .then 方法。
var fun1=(res)=>{
return new Promise((resolve,reject)=>{
setTimeout(()=>{
//这个请求用了1秒
resolve(res);
},1000)
});
}
var fun2=(res)=>{
return new Promise((resolve,reject)=>{
setTimeout(()=>{
//这个请求用了3秒
resolve(res);
},3000)
});
}
var obj={ name:"promise"};
var obj1={ name:"all"}
Promise.all([fun1(obj),fun2(obj1)]).then((res)=>{
//3秒后
console.log(res);
//[{"name":"promise"},{"name":"all"}]
//返回的是包含所有函数返回值的数组
}).catch((err)=>{
console.log(err);
})
Promise.all和Promise.race使用方式完全一样，区别在于all是数组中所有函数都执行了resolve方法才回调，race则是第一个执行了resolve方法就回调，这个就不上代码了，只是回调有区别。
网友评论