本文介绍了如何利用Promise来封装GET和POST两种类型的AJAX请求，以解决回调地狱问题。通过创建新的Promise实例，分别处理GET和POST请求的生命周期，当状态变为4且状态码为200时解析响应，否则拒绝请求。示例代码展示了如何发起请求并处理成功与失败的情况。
let geturl="http://xxx";
let posturl="http://xx";
1.get
function getRequest(Url){
let p=new Promise((resolve,reject)=>{
let xhr=new XMLHttpRequest();
xhr.open('GET',Url,true);
xhr.onreadystatechange=function(){
if(this.readyState===4){
if(this.status===200){
resolve(this.responseText,this);
}else{
reject("Request Fail");
}
}
}
xhr.send();
});
return p;
};
getRequest(geturl).then(data=>{
console.log("success:"+data);
}).catch((data)=>{
console.log("fail:"+data);
});
2.post
function postRequest(Posturl,data){
let p=new Promise((resolve,reject)=>{
let xhr=new XMLHttpRequest();
xhr.open("POST",Posturl,true);
xhr.onreadystatechange=function(){
if(this.readyState===4){
if(this.ststus=200){
resolve(this.responseText);
}else{
reject("Request Fail");
}
}
}
xhr.send(JSON.stringify(data));
});
return p;
}
postRequest(posturl).then(data=>{
console.log("success:"+data);
}).catch(data=>{
console.log("fail:"+data);
})
注：用Promise封装ajax要求对Promise有简单的了解，Promise是一个构造函数，它的参数是带有resolve和reject的函数。Promise的出现解决了使用异步回调地狱的问题。
344
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
