它是一个ES6提出一个新语法,用来优化异步代码的写法。
那么它是用来解决什么问题的呢
pormise的使用
用来优化异步代码。它的经典使用方式如下
var p1 = new Promise(function(resolve,reject){
//异步操作 resolve(obj1) 或者 reject(obj2)
});
p1.then(function(rs){
// 如果p1的状态是resolved,则then中的函数
//会执行,且obj1的值会传给rs
}).catch(function(rs){
// 如果p1的状态是reject,则catch中的函数
// 会执行,且obj2的值会传给rs
}).finally(function(){
// 一定会执行的函数
})
三种状态和值
一个Promise对象的状态可能是如下三种之一:pending,resolved,rejected 。下面分别介绍。
初始态pending
pending。它的意思是 "待定的,将发生的",相当于是一个初始状态。 创建Promise对象时,且没有调用resolve或者是reject方法,相当于是初始状态。这个初始状态会随着你调用resolve,或者是reject函数而切换到另一种状态。
var p = new Promise((resolve,rejectok,err)=>{ console.info('发呆.....' )})
console.dir(p)
这个初始状态就是你对别人说出承诺的那个瞬间,此时,大家都不知道这个承诺是否能兑现。
成功态resolved
也有叫fulfilled的。
resolved。表示解决了,就是说这个承诺实现了。 要实现从pending到resolved的转变,需要在 创建Promise对象时,在函数体中调用了resolve方法(即第一个参数)。
var p = new Promise((resolve,reject)=>{ resolved();})
console.dir(p)
注意,上面的resolve和reject仅是形参名而已。
失败态rejected
rejected。拒绝,失败。表示这个承诺没有做到,失败了。要实现从pending到rejected的转换,只需要在创建Promise对象时,调用reject函数。
var p = new Promise((resolve,reject)=>{ reject()} )
console.dir(p)
使用promise改造回调函数
原回调函数的写法
function getData({url,success}) {
const xhr = new XMLHttpRequest()
xhr.open('get', url)
xhr.onreadystatechange = function (){
if(this.readyState === 4){
// 加载完成
const d = JSON.parse(xhr.responseText);
success(d)
}
}
xhr.send()
}
改写之后
function getDataPromise (url) {
return new Promise((resolve,reject) => {
const xhr = new XMLHttpRequest()
xhr.open('get', url)
xhr.onreadystatechange = function (){
if(this.readyState === 4){
// 加载完成
const d = JSON.parse(xhr.responseText);
resolve(d)
}
}
xhr.send()
})
}