Promise是什么:
Promise是异步编程的一种解决方案。
JavaScript是单线程机制,所谓单线程就是按次序执行,执行完一个任务再执行下一个任务,同步就是一个单线程操作,同步编程会带来一个严重的问题------阻塞,即:假如用户在做某一个操作的时候,突然间进行一个异步操作(网络请求、计时器),而异步操作一般情况下是比较耗时的,此时代码执行到这个地方会出现阻塞,影响后续代码的运行,为了解决这个问题,我们一般在此时进行异步操作,即在发送网络请求的同时,继续执行后续代码,然后网络请求结束后,通过回调函数返回其结果。
同步操作遇到的问题:
以网络请求为例:第一次网络请求的结果中包含第二次网络请求的URL,第二次网络请求的结果中包含第三次网络请求的URL,第三次网络请求的结果中又包含第四次网络请求的URL…,此时就陷入了回调地狱,为了避免回调地狱的出现,使用Promise封装异步操作(此处也就是网络请求)。
Promise的三种所处的状态:
在Promise封装异步操作之后会有三种状态,pending:等待状态,比如正在进行网络请求,或者定时器没有到时间;fulfill:满足状态,当我们回调了resolve()函数时,就处于该状态,并且回调then();reject:拒绝状态,当我们主动回调了reject时,就会处于该状态,并且会回调catch()方法
Promise的使用:
使用关键字new创建Promise实例对象,该Promise需要传入两个参数resolve 和 reject;resolve 和 reject本身又是两个函数。
new Promise((resolve, reject) => {
// 网络请求
setTimeout(() => {
// 此处为了模仿网络请求成功与失败,将下方的resolve()注释:代表模仿的网络请求失败,执行catch(),若将reject()注释掉,代表网络请求成功,执行then()
resolve("请求到了数据");
// Promise不希望我们在此处处理网络请求的结果,希望在then()方法中处理
// reject("数据请求失败");
}, 1000)
}).then(res => {
// 此处的参数res代表成功请求到的数据
console.log(res);
}).catch(data => {
// 此处的data代表网络请求失败后的错误信息
console.log(data);
});
// 使用Promise封装真正的网络请求
let ajaxRequest = new Promise((resolve, reject) => {
$.ajax({
type: "get",
url: "url地址",
dataType: "json",
success: res => {
resolve(res);
},
error: res => {
reject(res);
}
});
});
// 网络请求成功的处理
ajaxRequest.then(res => {
listArr = res.data.banner.list;
console.log(listArr);
});
// 网络请求失败的处理
ajaxRequest.catch(res => {
console.log(res.returnCode);
});