前端笔记Vue项目day4(三）

 

静态方法.all()

• Promise.all方法接受一个数组作参数，数组中的对象（p1、p2、p3）均为promise实例（如果不是一个promise，该项会被用Promise.resolve转换为一个promise)。它的状态由这三个promise实例决定

.race()

• Promise.race方法同样接受一个数组作参数。当p1, p2, p3中有一个实例的状态发生改变（变为fulfilled或rejected），p的状态就跟着改变。并把第一个改变状态的promise的返回值，传给p的回调函数

• [mw_shl_code=applescript,true]<script type="text/javascript">
      /*
        Promise常用API-对象方法
      */
      // console.dir(Promise)
      function queryData(url) {
        return new Promise(function(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 p1 = queryData('http://localhost:3000/a1');
      var p2 = queryData('http://localhost:3000/a2');
      var p3 = queryData('http://localhost:3000/a3');
       Promise.all([p1,p2,p3]).then(function(result){
         //   all 中的参数  [p1,p2,p3]   和 返回的结果一 一对应["HELLO TOM", "HELLO JERRY", "HELLO SPIKE"]
         console.log(result) //["HELLO TOM", "HELLO JERRY", "HELLO SPIKE"]
       })
      Promise.race([p1,p2,p3]).then(function(result){
        // 由于p1执行较快，Promise的then()将获得结果'P1'。p2,p3仍在继续执行，但执行结果将被丢弃。
        console.log(result) // "HELLO TOM"
      })
    </script>[/mw_shl_code]