Promise使用的基本格式
//promise的使用
function fn(){
return new Promise((resolve, reject)=>{
成功时调用 resolve(data)
失败时调用 reject(err)
})
}
fn().then((data)=>{}, fail)
//..then()的第二个参数也可以写到.catch()里
AJAX
前端向后端发送请求需要用到AJAX或者相关库(如Axios),
//AJAX代码
var request = new XMLHttpRequest()
request.open('GET', 'url', true);
request.onreadystatechange = function () {
if(request.readyState === 4 && request.status === 200) {
function(request.responseText){
//处理返回结果的code
};
}};
request.send();
而这些请求操作都是异步操作,如果需求是在请求成功后再发送请求,则会出现多层嵌套,形成回调地狱,影响代码可读性。
此时使用Promise就可以大大理顺代码逻辑,增强代码可读性。
Promise结合AJAX
function request(type,url,...params){
return new Promise((resolve, reject)=>{
var request = new XMLHttpRequest()
request.open(type, 'url', true);
request.onreadystatechange = function () {
if(request.readyState === 4 && request.status === 200) {
resolve(request.responseText)
}else{
reject(err)
}
request.send();
})
}
//promise请求的调用
request(...params)
.then(data => {
})
.catch(err => {
})