ES6探索 —— Promise对象

最近在接触react-redux异步action的时候，有一个异步的写法很是有意思。应用了Promise对象，很好解决了不优雅的金字塔结构代码。
传统的回调代码一层套一层，当你想要写一个异步请求，请求里面又带着请求的时候，该怎么作呢。

没有使用Promise对象的时候，代码是这样的：

$.getJSON(url,req,function(data,status){
    if(status == "success"){
        $.getJSON(url,data,function(data,status){
            if(status == "success"){
                $.getJSON(url,data,function(data,status){
                    if(status == "success"){
                        //.....
                    }else{
                        throw new Error("error")
                    }
                })
            }else{
                throw new Error("error");
            }
        })
    }else{
        throw new Error("error");
    }
})

再来几回估计咱们会崩溃的，如今咱们用Promise的方法来写一遍：

var promise = new Promise((resolve,reject) => {
    $.getJSON(url,data,function(data,status){
        if(status == "success"){
            resolve(data)
        }else{
            var error = new Error("error");
            reject(error)
                                                                                    
        }
    })
})
.then((data) => {
    return new Promise((resolve,reject) => {
        $.getJSON(url,data,function(data,status){
            if(status == "success"){
                resolve(data)
            }else{
                var error = new Error("error");
                reject(error)
                                                                                    
            }
        })
    })
},(error) => { throw error })
.then((data) => {
    return new Promise((resolve,reject) => {
        $.getJSON(url,data,function(data,status){
            if(status == "success"){
                resolve(data)
            }else{
                var error = new Error("error");
                reject(error)
                                                                                    
            }
        })
    })
},(error) => { throw error })

怎么样，是否是以为每一步都清晰不少，尤为是回调中的操做更多的时候，这种步骤感更加明显。
新同窗确定会有些迷惑，接下我就一步一步的重现个人探索过程。给一样在学习路上的大家提供一点帮助吧

首先咱们能够尝试写一个最简单的例子

var promise = new Promise((resolve,reject) => {
    var a = 1;
    if( a > 0 ){
       resolve(a);
    }else{
       reject(error);
    }
})

当咱们新建了一个promise实例的时候，里面的function会当即执行
参数resolve表明该符合条件时触发的触发的函数。reject表示程序异常的处理函数。
接下来咱们就能够经过.then来触发下面的步骤。

promise.then(
    (data) => { console.log(data) },
    (error) => { console.log(error) }
)

由于咱们是符合条件的，因此咱们会看到输出的结果是 1

固然咱们改造一下当前调用，能够继续执行下去。
上一个函数return 的值，就是咱们下面要调用函数的data；

promise.then(
    (data) => { 
        console.log(data)；
        return data+1;
    },
    (error) => { console.log(error) }
).then(
    (data) => {
        console.log(data);
    }
)

输出结果是 1 2

这时候细心的同窗就会发现了，若是咱们抛出异常的话 输出结果 就是一个error 和 undefined，这显然不是咱们想要达到的效果。那么怎么让他reject的时候中止执行下面的函数呢。
很简单，只要把错误给抛出就能够了。这样的话就不会继续执行下去了。

promise.then(
    (data) => { 
        console.log(data)；
        return data+1;
    },
    (error) => { throw error }
).then(
    (data) => {
        console.log(data);
    }
)

当promise里面也是一个异步请求的时候，咱们只须要在最后返回一个新的Promise 实例，就能够实现异步的顺序执行。

promise.then(
    (data) => new Promise((resolve,reject) => {
        var b = 0;
        if(b<1){
            resolve(b);
        }else{
            reject(error);
        }
    }),
    (error) => { throw error }
).then(
    (data) => { console.log(data); },
    (error) => { throw error }
)

以上就实现了一个简单的例子编写啦，固然promise还有一些高级的用法,详情请参考阮一峰老师的教程。 若是以上有什么疏漏或者错误的地方，欢迎各位大神指正，谢谢你们。