ES6--Promise对象

Promise 是一个容器 里面放的是未来或者异步的即将发生的事件
Promise 对象的使用也是一个构造函数，用来生成Promise实例
Promise 对象的三大状态（Pending（进行中）、Resolved（已完成）和Rejected（已失败））不受外界影响，只有当前异步编程的结果会决定当前状态。

Promise实例的生成和返回信息

 //Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject
    let pro=new Promise(function(resolve,reject){
        let status=false;   //模拟异步操作失败的状态
        if(status){
        //在异步操作成功时调用resolve()，并将异步操作的结果，作为参数传递出去
            resolve("请求成功");
        }else{
         //在异步操作失败时调用reject()，并将异步操作报出的错误，作为参数传递出去
            reject("异步请求失败");
        }
    })

   //Promise实例生成后，用then方法指定两个回调函数
   //第一个是Promise实例状态变成resolved的时候调用
   //第二个是Promise实例状态变成rejected的时候调用
    pro.then(function(value){
        console.log(value);    //resolved的状态下 输出resolve()传递的参数  
    },function(error){
        console.log(error);    //rejected的状态下 输出reject()传递的参数
    })

   //then()中的两个函数可以写为then().catch()
    promise.then(function (result) {
        console.log(result);
    }).catch(function (error) {
       console.log(error);
    );

Promise与计时器的应用

     let times = function(ms){
           return new Promise(function(resolve,reject){
               try{
                  setTimeout(resolve,ms,"参数");
               }
               catch(e){
                  reject(e);
               }
           });
       }
       times(1000).then(function(result){
           console.log(result);
       },function(error){
           console.log(error);
    })

异步加载图片

 //异步加载图片
       {
          let bdy = document.querySelector("body");
          let image=function(src){
          return new Promise(function(resolve,reject){
              let img=new Image();
              img.src=src;
              bdy.append(img);
              img.onload=function(){
                      resolve(img);
                  }
                  img.onerror=function(){
                      reject("图片加载失败");
                  }
              })
          }

        image("https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3386247472,87720242&fm=26&gp=0.jpg")
          .then(function(result){
              console.log(result);  //加载成功 输出 图片信息
          },function(error){
              console.log(error);
          })
    }

Promise 与 ajax 的使用

let Pajax = new Promise(function(resolve,reject){
    $.ajax({
        method:"get",
        data:{id:"101051107"},
        url:"https://api.help.bj.cn/apis/weather/",  //天气预报接口
        success:function(res){
            resolve(res);  
        },
        error:function(err){
            reject(err);
        }
    })
})

 Pajax.then(function(res){
     console.log(res);
 },function(err){
     console.log(err);
     // "status": "302",
     // "cityid": "10105117",  //传入不存在的数据
     // "msg": "城市没有找到！"  //输出错误
 })

Promise的方法

Promise.all()      //将所有Promise对象转换为一个Promise对象
Promise.resolve()  //将现有对象转换为Promise对象

  let p1=new Promise(function(resolve,reject){
      resolve("a");
  });
  let p2=new Promise(function(resolve,reject){
      resolve("b");
  });
  Promise.all([p1,p2]).then(function(result){
      console.log(result);  //输出 ["a", "b"]
      //将现有对象转换为Promise对象
     console.log(Promise.resolve(result));  
     //输出Promise {<resolved>: Array(2)} 0: "a" 1: "b"
     },function(error){
         console.log(error);
  });