ES6中Promise的含义和案例

1、基本用法

ES6规定，Promise对象是一个构造函数，用来生成Promise实例

var promise = new Promise(function(resolve,reject){
  if(/* 异步操作成功 */){
    resolve(value);
  }else{
    reject(error);
  }
});

promise.then(function(data){
    console.log('resolved');
    console.log(data);
})
.catch(function(reason){
    console.log('rejected');
    console.log(reason);
});

Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject,分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。

2、链式调用

function runAsync1(){
    var p = new Promise(function(resolve, reject){
        //做一些异步操作
        setTimeout(function(){
            console.log('异步任务执行完成1');
            resolve('数据1');
        }, 1000);
    });
    return p;            
}
function runAsync2(){
    var p = new Promise(function(resolve, reject){
        //做一些异步操作
        setTimeout(function(){
            console.log('异步任务执行完成2');
            resolve('数据2');
        }, 2000);
    });
    return p;            
}
function runAsync3(){
    var p = new Promise(function(resolve, reject){
        //做一些异步操作
        setTimeout(function(){
            console.log('异步任务执行完成3');
            resolve('数据3');
        }, 2000);
    });
    return p;            
}
 
runAsync1()
.then(function(data){
    console.log(data);
    return runAsync2();
})
.then(function(data){
    console.log(data);
    return runAsync3();
})
.then(function(data){
    console.log(data);
});

Promise通过resolve()进行数据传输。
控制台输出结果：

异步任务执行完成1
数据1
异步任务执行完成2
数据2
异步任务执行完成3
数据3

3、案例

假如有aFun,bFun请求，bFun依赖aFun的请求数据。如下：

```javascript
function aFun(){
      return new Promise(function(res,rej){
        $.ajax({
          url:"a接口",
          type: "GET",
          async:true,
          dataType:"json",
          success:function(data){
            console.log(data,"aFun");
            res(data);
          }
        })
      });
    }
    function bFun(data){
      console.log(data,"data");
      return new Promise(function(res,rej){
        $.ajax({
            url:"b接口",
            type: "POST",
            async:true,
            data:JSON.stringify(data),
            dataType:"json",
            success:function(data){
              console.log(data,"bFun");
              res();
            }
          })
      });
    }
    $("#btn").click(function(){
      aFun().then(function (data){
        bFun(data);
      }).then(function(){
      })
    })

4、兼容性问题

1、在项目中使用到了ES6的Promise对象，代码在谷歌浏览器中正常运行，而在360浏览器下的兼容模式下，IE内核是不支持Promise的。
2、通过can i use网站https://caniuse.com/）查到的ES6 promise的支持情况

3、要是在项目中使用Promsie对象，解决方法是使用第三方插件bluebird.js（github地址：https://github.com/petkaantonov/bluebird）
4、总结：bluebird中对ES6的原生Promise进行了封装，解决了浏览器兼容性问题