[JavaScript知识库]js--手写promise.all

核心思路：

• 接收一个Promise实例的数组或具有Iterator接口的对象作为参数
• 这个方法返回一个新的promise对象
• 遍历传入的参数，用promise.reslove()将参数“包一层”，使其变成一个promise对象
• 参数所有的回调成功才是成功，返回值数组与参数顺序是一致的
• 参数数组其中一个失败，则触发失败状态，第一个触发失败的promise错误信息作为promise.all的错误信息

代码实现：

一般来说，promise.all 用来处理多个并发请求，也是为了页面数据构造的方便，将一个页面所用到的在不同接口的数据一起请求过来，不过，如果其中一个接口失败了，多个请求也就失败了，页面可能啥ue出不来，这就需要看当前页面的耦合程度了。

<script>
         function promiseAll(promises){
          //     返回一个新的promise对象
          return new Promise(function(reslove,reject){
               // 判断参数是否是一个数组
               if(! Array.isArray(promises)){
                    throw new TypeError('argument must be a array')
               }
               var resolvedCounter = 0
               var promiseNum = promises.length
               var reslovedResult = []
               for(let i = 0;i<promiseNum;i++){
                    Promise.resolve(promises[i]).then(value=>{
                         resolvedCounter++
                         reslovedResult[i] = value
                         if(resolvedCounter == promiseNum){
                              return reslove(reslovedResult)
                         }
                    },error=>{
                         return reject(error)
                    })
               }
          })
         }

     // 测试
     const p1 = new Promise((reslove,reject)=>{
          setTimeout(function(){
               reslove(1)
          },1000)
     })
     const p2 = new Promise((reslove,reject)=>{
          setTimeout(function(){
               reslove(2)
          },2000)
     })
     const p3 = new Promise((reslove,reject)=>{
          setTimeout(function(){
               reslove(3)
          },3000)
     })
     promiseAll([p3,p1,p2]).then(res=>{
          console.log(res)  //[3,1,2]
     })
    </script>