1.什么是Promise
JS中解决异步操作的新方法(旧方法是使用回调函数)
1.从语法上来说,它是一个构造函数
2.从功能上来说,它用来封装一个异步操作并能获取其成功或失败的返回值
2.为什么要用Promise
1.指定回调的方法更加灵活:
旧方法:必须在异步操作前指定
Promise:异步操作->返回promise对象->给promise对象绑定回调函数
2.支持链式调用,可以解决回调地狱问题
回调地狱:回调函数嵌套调用,外面回调异步执行的结果是内部回调函数进行的条件
回调地狱的缺点:不便于阅读,不便于异常处理
3.promise的使用
const p = new Promise((resolve, reject) => {
setTimeout(() => {
let n = rand(1, 100)
if (n <= 30) {
resolve(n) //将promise对象的状态设置为成功
} else {
reject(n) //将promise对象的状态设置为失败
}
}, 1000)
})
p.then((value) => {
alert('恭喜中奖' +value) //成功回调
}, (reason) => {
alert('再接再厉' +reason) //失败回调
})
p.catch(reason=>{}) //失败回调
4.promise封装ajax
function sendAjax(url){
return new Promise((resolve,reject)=>{
const xhr = XMLHttpRequest()
xhr.open('get',url)
xhr.send()
xhr.onreadystatechange =function(){
if(xhr.readyState ===4){
if(xhr.status >=200 && xhr.status <300){
resolve(xhr.response)
}else{
reject(xhr.status)
}
}
}
})
}
sendAjax(url).then((value)=>{
console.log(value);
},(reason)=>{
console.log(reason);
})
5.promise对象
当前为成功
[PromiseState]状态:1.从pending变为resolved/fulfilled(成功)
2.从pending变为rejected(失败)
[PromiseResult] 值:1.resolve(成功)
2.reject(失败)
6.promise的方法
promise.resolve(参数) :直接返回一个结果,传入的参数不是promise时返回成功,传入的参数是promise时,返回的结果是传入的参数promise的结果
promise.reject(参数):传什么都返回错误
promise.all([参数]):参数必须都是成功才返回成功,有一个错误返回错误
promise.race([参数]):当第一个改变的参数结果为成功时,返回成功,失败时返回失败