Promise

1. Promise常用方法

   • Promise.prototype.then()

     接受两个参数resolved 回调 rejected 回调（可选）

   • Promise.prototype.catch()

     是.then(null, rejection)或.then(undefined, rejection)的> 别名，用于指定发生错误时的回调函数。

   • Promise.prototype.finally()

     方法用于指定不管 Promise 对象最后状态如何，都会执行的操作

   • Promise.all()

   • Promise.race()

   • Promise.resolve()

   • Promise.reject()

2. 基本用法

    // 传入 resolve reject 参数 返回一个promise对象
    const promise = new Promise((resolve,reject) => {
    // code
    if() {
      return  resolve(value);
    }
    reject(value);
    });
    promise.then((value) => {
    // code
    }).catch((err) => {
      // code
    })
   
   

3. promise异步加载图片

      function loadImage_Async(url) {
        return new Promise((resolve, reject) => {
          const img = new Image(100, 100); //相当于document.createElement('img')
   
          img.onload = function() {
            resolve(img);
          };
          img.onerror = function() {
            reject(new Error("File Not found!"));
          };
          img.src = url;
        });
      }
   
      window.onload = function() {
        loadImage_Async("/1.png")
          .then(img => {
            document.body.appendChild(img);
          })
          .catch(err => {
            console.log(err);
          });
      };
   
   

4. promise 封装Ajax

    function ajax_promise(url) {
      return new Promise((resolve, reject) => {
        const handle = function() {
          if (this.readyState ===4 && this.status === 200) {
            resolve(this.response);
          }
        };
        const xhr = new XMLHttpRequest();
        xhr.open("GET", url);
        xhr.onreadystatechange = handle;
        xhr.responseType = 'json';
        xhr.setRequestHeader("Accept", "application/json");
        xhr.send();
      });
    }
    ajax_promise(url)
      .then(data => {
        console.log(data);
      })
      .catch(err => {
        console.log(err);
      });
   
   

原文：
ruanyifeng：Promise对象