Promise

1.Promise 的用途

1. promise规范了异步事件处理的写法
2. 避免了出现回调地狱
3. 方便错误捕获

2.使用Promise

1. 如何创建一个 new Promise

return new Promise((resolve,reject)=>{})

2. 如何使用 Promise.prototype.then

then可以接受两个函数参数，onFulfilled和onRejected函数，各自有一个参数，分别在promise变成fulfilled/rejected状态时调用

3. then的返回值大致有两种情况：

情况1：返回 Promise 实例对象。返回的该实例对象会调用下一个 then。 情况2：返回普通值。返回的普通值会直接传递给下一个then，根据promise的状态，通过 then 参数中函数的参数接收该值。 因此，then可以进行链式调用，避免了层层的回调地狱 举例：

        const request = require('request');

          // Promise 封装接口1
          const request1 = function() {
              const promise = new Promise(resolve => {
                  request('https://www.baidu.com', function(response) {
                      if (response.retCode == 200) {
                          // 这里的 response 是接口1的返回结果
                          resolve('request1 success'+ response);
                      } else {
                          reject('接口请求失败');
                      }
                  });
              });

              return promise;
          };

          // Promise 封装接口2
          const request2 = function() {
              const promise = new Promise(resolve => {
                  request('https://www.jd.com', function(response) {
                      if (response.retCode == 200) {
                          // 这里的 response 是接口2的返回结果
                          resolve('request2 success'+ response);

                      } else {
                          reject('接口请求失败');
                      }
                  });
              });

              return promise;
          };

          // Promise 封装接口3
          const request3 = function() {
              const promise = new Promise(resolve => {
                  request('https://www.taobao.com', function(response) {
                      if (response.retCode == 200) {
                          // 这里的 response 是接口3的返回结果
                          resolve('request3 success'+ response);

                      } else {
                          reject('接口请求失败');
                      }
                  });
              });

              return promise;
          };

          // 先发起request1，等resolve后再发起request2；紧接着，等 request2有了 resolve之后，再发起 request3
          request1()
              .then(data => {
                  // 接口1请求成功后，打印接口1的返回结果
                  console.log(data);
                  return request2();
              })
              .then(data => {
                  // 接口2请求成功后，打印接口2的返回结果
                  console.log(data);
                  return request3();
              })
              .then(data => {
                  // 接口3请求成功后，打印接口3的返回结果
                  console.log(data);
              });

3.如何使用 Promise.all

并发处理多个异步任务，所有任务都执行成功，才能得到结果。 也会返回一个promise实例

function queryData(url) {
             return new Promise((resolve, reject) => {
                 var xhr = new XMLHttpRequest();
                 xhr.onreadystatechange = function() {
                     if (xhr.readyState != 4) return;
                     if (xhr.readyState == 4 && xhr.status == 200) {
                         // 处理正常结果
                         resolve(xhr.responseText);
                     } else {
                         // 处理异常结果
                         reject('服务器错误');
                     }
                 };
                 xhr.open('get', url);
                 xhr.send(null);
             });
         }

         var promise1 = queryData('http://localhost:3000/api1');
         var promise2 = queryData('http://localhost:3000/api2');
         var promise3 = queryData('http://localhost:3000/api3');

         Promise.all([promise1, promise2, promise3]).then(result => {
             console.log(result);
         });

4.如何使用 Promise.race

与all用法基本相似，并发处理多个异步任务，不同之处在于只要有一个任务执行成功，就能得到结果。