/*
* Promise --是异步编程的一种解决方案
消除异步操作（有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数）
*/
//下面就一起来看看怎么封装一个简单的Promise异步请求 ：
createPromise=(url,type)=>{ //传入 路径,请求方式 作为参数
//返回Promise 对象
return new Promise((resolve,reject)=>{
//resolve 成功
//reject 失败
$.ajax({
type,
url,
// url:url 名字 值 一样可以简写
dataType:'json',
//成功
success(res){
//成功 调用 resolve
resolve(res)
},
//失败
error(err){
//失败 调用 reject
reject(err)
}
});
})
}
/*
* Promise.all方法接受一个数组作为参数都是一个Promise实例,只有这些 实例 状态都成功 promise才会成功,返回值为一个数组,
这些参数参数中有一个被reject,那么promise状态就变成reject
*/
/*
* Promise.then方法的第一个参数是resolved状态的回调函数，第二个参数（可选）是rejected状态的回调函数
*
*/
// Promise.all([
// createPromise('data/json1.json'),
// createPromise('data/json2.json')
// ]).then((res)=>{
// console.log(res)
// },(err)=>{
// console.log(res)
// })
/*
* Promise.prototype.catch方法是.then(null, rejection)的别名，用于指定发生错误时的回调函数
*/
Promise.all([
createPromise('data/json1.json','post'),
createPromise('data/json2.json','post')
]).then((res)=>{
console.log(res)
}).catch((res)=>{
console.log('错误执行'+res)
})
//Promise.race 我称它为 竞速
/*
* Promise.race方法同Promise.all方法 写法一样 同样是将多个 Promise 实例,包装成一个新的 Promise 实例,
* 只要这些实例之中有一个实例率先改变状态，Promise的状态就跟着改变,那个率先改变的 Promise 实例的返回值,就是最终执行结果的返回值
*/
/*
Promise.race([
createPromise('data/json1.json'),
createPromise('data/json2.json')
]).then((res)=>{
console.log(res)
},(err)=>{
console.log(res)
})
*/
// 高版本JQuery(我这里用的是3.1.1)可直接调用Promise,用法如下：
/*
Promise.all([
$.ajax({url:'data/json1.json',dataType:'json'}),
$.ajax({url:'data/json2.json',dataType:'json'}),
]).then((res)=>{
console.log(res)
},(err)=>{
console.log(err)
})
*/
ps:如有错误我改,望轻喷,谢谢大家!
网友评论