ES6中的promise对象

[Abiel1024]

出现

Promise是异步编程的一种解决方案，最早由社区提出和实现，ES6 将其写进了语言标准，统一了用法。新版的chrome和firefox也已经支持该语法，如果要兼容低版本的浏览器，我们可以使用es6-promise这个polyfill库来处理。

基本用法

在了解基本用法之前，我们得先了解Promise的三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。
这三种状态只会根据异步操作的结果进行改变，任何其他的操作都没有办法改变。同时，状态一旦改变就不会发生逆转。状态的改变有两种情况： 从pending变为fulfilled和从pending变为rejected。
如果改变已经发生了，你再对Promise对象添加回调函数，会立即得到这个结果。

通过一个ajax来了解Promise。

传统写法：
getData(method, url, successFun, failFun){
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open(method, url);
  xmlHttp.send();
  xmlHttp.onload = function () {
    if (this.status == 200 ) {
      successFun(this.response);
    } else {
      failFun(this.statusText);
    }
  };
  xmlHttp.onerror = function () {
    failFun(this.statusText);
  };
}
利用Promise写法：
getData(method, url){
  var promise = new Promise(function(resolve, reject){
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open(method, url);
    xmlHttp.send();
    xmlHttp.onload = function () {
      if (this.status == 200 ) {
        resolve(this.response);
      } else {
        reject(this.statusText);
      }
    };
    xmlHttp.onerror = function () {
      reject(this.statusText);
    };
  })
  return promise;
}
getData('get','www.xxx.com').then(successFun, failFun)

prototype.then()

上面用到了Promise实例的.then方法。通过之前的对对象的学习，我们知道then方法是定义在原型对象Promise.prototype上的。他的作用是为 Promise 实例添加状态改变时的回调函数。通过例子我们可以看到then方法接受两个参数，第一个参数是resolved状态的回调函数，第二个参数（可选）是rejected状态的回调函数。同时，resolve和reject能往对应的方法中传参数。

var p = new Promise(function(resolve, reject){
    resolve(5)
}).then(function(value){
    console.log(value) //5
})

var p1 = new Promise(function(resolve, reject){
    reject(new Error('错误'))
}).then(function(value){
    console.log(value)
}, function(reason){
    console.log(reason) //Error: 错误(…)
})

prototype.catch()

Promise.prototype.catch方法是.then(null, rejection)的别名，用于指定发生错误时的回调函数。
也就是说下面两种代码的效果其实是一样的

new Promise(function(resolve, reject){
	reject(new Error('error'))
}).then(undefined, function(reason){
    console.log(reason) // Error: error(…)
})

new Promise(function(resolve, reject){
    reject(new Error('error'))
}).catch(function(reason){
    console.log(reason) // Error: error(…)
})

Promise.all()与Promise.race()

Promise.all与Promise.race方法都是用于将多个 Promise 实例，包装成一个新的 Promise 实例。

区别：
Promise.all只有包含的所有实例的状态都变成fulfilled，或者其中有一个变为rejected，才会调用Promise.all方法后面的回调函数。
Promise.rece只要任何一个实例率先改变状态，新的Promise的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p的回调函数。