promise

Promise对象

• promise的含义
  promise是异步编程的一种解决方案，比传统的解决方案——回调函数和事件，更合理和强大。
  所谓promise，简单的说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，promise就是一个对象，从它可以获取异步操作的消息。promise提供统一的API，各种异步操作都可以用同样的方法进行处理。

  • promise对象有以下两个特点
    （1）对象的状态不受外界影响。promise对象代表一个异步操作，有三种状态：pending（进行中）、resolved（已完成，又称fulfilled）和rejected（已失败）。只有异步操作的结果，可以决定当前是哪种状态，其他的任何操作都无法改变这个状态。
    （2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。promise的状态改变只能有两种：从pending变为resolved和pending变为rejected。只要这两种情况发生，状态就凝固了，不会再改变，会一直保持这个结果。就算改变已经发生了，你再次对promise对象添加回调函数，也会立即得到这个结果。这与事件完全不同，事件的特点是，如果你错过了他，再去监听是得不到结果的。
    promise对象提供统一的接口，使得控制异步操作更加容易。
• promise缺点：无法取消promise，一旦新建就会立即执行，无法中途取消；如果不设置回调函数，promise内部抛出错误，不会反映到外部；当处于pending状态时，无法的到目前进展到哪一个阶段（刚刚开始还是即将完成）。
  如果某些事件不断地反复发生，一般来说，使用stream模式比promise更好。

promise总结

• 含义

  1. 用来传递异步的信息，解决回调地域的问题；
  2. 特点
     
     • 有三种状态：pending（进行中）、resolve（已完成）、reject（失败）；
     • 状态只能从pending——resolve，pending——reject。

• 用法

  1. 创建promise对象实例
  2. 实例生成后可以用then方法分别指定resolve和reject的回调函数；
  3. resolve和reject回调函数的参数都可以是promise对象。

• promise的方法

  1. promise.then()：返回的是一个promise，可以用链式写法；
  2. .catch()：用于指定发生错误时的回调函数，返回的也是promise对象；
  3. promise.resolve()：将现有对象转化成promise对象
  4. promise.reject()：返回一个新的promise对象。

• 封装多个promise实例

  1. promise.all()：所有状态都变为resolve是，封装对象P才变为resolve状态；
  2. promise.race()：参数有一个状态改变，P就改变

• 用途

  1. 部署ajax

     //promise部署Ajax
     var getJSON = function(url){
         var promise = new Promise(function(resolve, reject){
             var client = new XMLHttpRequest();
             client.open("GET", url);
             client.onreadystatechange = handler;
             client.responseType = "json";
             client.setRequestHeader("Accept", "application/json");
             client.send();
     
             function handler(){
                 if(this.readyState !== 4){
                     return;
                 }
                 if(this.state == 200){
                     resolve(this.response);
                 }else{
                     reject(new Error(this.statusText));
                 }
             };
         });
     
         return promise;
     };
     
     getJSON("/posts.json").then(function(json)P{
         console.log('Contents:' + json);
     }, function(error){
         console.log('出错了', error);
     });
     

  2. 加载图片

     //promise异步加载图片
     function loadImageAsync(url){
         return new Promise(function(resolve, reject){
             var image = new Image();
     
             image.onload = function(){
                 resolve(image);
             };
     
             image.onerror =function(){
                 reject(new Error('could not load image at'+url));
             };
     
             image.src = url;
         });