相信經常使用ajax的前端小夥伴，都會遇到這樣的困境：一個接口的參數會需要使用另一個接口獲取。

年輕的前端可能會用同步去解決（笑~），因為我也這麽幹過，但是極度影響性能和用戶體驗。

正常的前端會把接口寫在另一個接口的回調裏。是這樣不錯，但是它增加了函數的嵌套深度也會造成一定的邏輯混亂。

也許有朋友會說，哪那麽多毛病，解決問題不就好了嗎？

但是，如果需要的是另外好幾個接口的返回數據呢？這時候就會比較蛋疼了。這就是回調地獄！

當時依稀記得是使用了jQuery的 when .then方法去解決的。

直到遇見了Promise,它完美優雅的解決了回調地獄難題！

//創建一個Promise實例，獲取數據。並把數據傳遞給處理函數resolve和reject。需要註意的是Promise在聲明的時候就執行了。
var getUserInfo=new Promise(function(resolve,reject){
    $.ajax({
        type:"get",
        url:"index.aspx",
        success:function(data){
            if(data.Status=="1"){
                resolve(data.ResultJson)//在異步操作成功時調用
            }else{
                reject(data.ErrMsg);//在異步操作失敗時調用
            }
        }
    });
})
//另一個ajax Promise對象，
var getDataList=new Promise(function(resolve,reject){
    $.ajax({
        type:"get",
        url:"index.aspx",
        success:function(data){
            if(data.Status=="1"){
                resolve(data.ResultJson)//在異步操作成功時調用
            }else{
                reject(data.ErrMsg);//在異步操作失敗時調用
            }
        }
    });
})
//Promise的方法then,catch方法
getUserInfo.then(function(ResultJson){
    //通過拿到的數據渲染頁面
}).catch(function(ErrMsg){
    //獲取數據失敗時的處理邏輯
})
//Promise的all方法，等數組中的所有promise對象都完成執行
Promise.all([getUserInfo,getDataList]).then(function([ResultJson1,ResultJson2]){
    //這裏寫等這兩個ajax都成功返回數據才執行的業務邏輯
})

這樣的代碼分工非常明確，ajax就是拿數據的，.then .catch方法就是處理業務邏輯，代碼異常清晰。

使用ES6的Promise完美解決回調地獄