promise解决地狱回调

200 阅读2分钟

promise

它是一个ES6提出一个新语法,用来优化异步代码的写法

  • 在ES6中,它是新增的构造器(Array, Object, Promise),用来优化实现异步操作。在没有它之前,javascript中的异步处理,大多是利用回调函数来实现的。典型的几种如下:(1)setTimeout (2)ajax (3)nodejs中的文件读取。现在有了promise,就可以对这些异步操作进行改写了。

经典使用方式如下:

let 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对象有三种状态和值

  1. 初始态pending pending。它的意思是 "待定的,将发生的",相当于是一个初始状态。 创建Promise对象时,且没有调用resolve或者是reject方法,相当于是初始状态。这个初始状态会随着你调用resolve,或者是reject函数而切换到另一种状态。
let p = new Promise((resolve,rejectok,err)=>{ console.info('发呆.....' )})
console.dir(p)

2.成功态resolved

resolved。表示解决了,就是说这个承诺实现了。 要实现从pending到resolved的转变,需要在 创建Promise对象时,在函数体中调用了resolve方法(即第一个参数)。

let p = new Promise((resolve,reject)=>{ resolved();})
console.dir(p)

3.失败态rejected

rejected。拒绝,失败。表示这个承诺没有做到,失败了。要实现从pending到rejected的转换,只需要在创建Promise对象时,调用reject函数。

var p = new Promise((resolve,reject)=>{ reject()} )
console.dir(p)

三种状态小结

1.状态是可转化

最初创建promise对象时,默认状态是pending,如果在函数体内部调用了第一个参数对应的函数,则状态变成了resolved;如果调用了第二个参数对应的函数,则状态变成了rejected。

2.状态转换是不可逆的

一旦从pending ---> resolved(或者是rejected),就不可能再回到pending,也不能由resolved变成rejected。

image.png

  • 状态从pending变成resolved,进入then中,调用函数,并传入此时的promiseValue(就是调用resolve时传入的实参)
  • 状态从pending变成rejected,进入catch中,调用函数,并传入此时的promiseValue(就是调用reject时传入的实参)

回调地狱

什么是回调地狱

image.png 如上图可以理解为套娃

用promise优化地狱回调

如下:

 getDataPromise('http://localhost:3000/get').then(data=>{
            return getDataPromise('http://localhost:3000/getCategory?id='+data[0].id)
        }).then(data => {
            return getDataPromise('http://localhost:3000/getNews?id='+data[0].id)
        }).then(data => {
            console.log(data)
        })