基于Promise发送Ajax请求

function promiseAjax(url){

var p = new Promise(reslove,reject=>{  //创建一个Promise实例对象

var xhr = new XMLHttlRequest();    // 创建 XMLHttpRequest对象

xhr.onreadyStateChange=function(){  //实例对象状态发生改变时调用将函数

if(xhr.readyState!==4) return;    //使用 if判断语句判断请求状态是否完成,如果没有完成直接return

if(xhr.readyState==4&&xhr.state==200){ //当请求状态完成时,并且状态码为200时候进入if判断分支

reslove(xhr.responseText)//进入到请求成功的if分支中后,使用reslove函数将请求成功后返回的结构传递出去

}else{

reject(‘发生了错误‘) //reject函数是将请求失败的结果传递出去

}

}

xhr.open(‘get‘,url)//设置请求方式和请求地址

xhr.send(null)//因为是采用‘Get’方式发送请求,send()中为null

})

return p;//将Promise实例对象返回出去,方便在外部使用

}

promiseAjax(‘http://www.baidu.com‘).then(function(resolve){//调用这个函数,这个函数的结果是Promise实例对象,可以采用.then()的方式得到请求成功的结果

//在.then()中有两个回调函数,回调函数中的resolve是传递过来的请求成功的结果

console.log(reslove) //正常情况下输出结果

}),function(reject){//第二个回调函数中接收请求错误的结果

console.log(reject)  //发生错误时打印错误信息

})

注意:.then()中可以只接收请求成功的结果,请求错误的结果可以使用链式编程.catch()的方式接收

基于Promise发送Ajax请求

上一篇:js 常用类和方法


下一篇:SQL判断是否"存在"