时间戳

首页 > 解决方案 > 等到 for 循环中的所有 XHR 请求都完成后再进行下一步操作

javascript - 等到 for 循环中的所有 XHR 请求都完成后再进行下一步操作

问题描述

作为一个 JS 菜鸟，我这几天一直在失败。我需要等到 for 循环中的所有 XHR 请求都完成，然后继续下一个操作。我该怎么做呢？

这是其中的一个片段：

window.onload = function () {
    (function () {
        var xhr = []

        for (let i = 0; i < 1000; i ++) {
            (function () {
                xhr[i] = new XMLHttpRequest()
                xhr[i].open('GET', 'http://www.example.com')
                xhr[i].send()
                console.log('done')
            })()
        }
        console.log('Done')

    })()
}

标签： javascripthtmlfor-loopasynchronousxmlhttprequest

解决方案

函数内部的调用是同步调用。即使您的函数调用是异步的，for 循环也是同步的。您必须将 for 循环包装在同步函数中以获得所需的输出。

window.onload = function () {
   setTimeout(()=>{
      for (let i = 0; i < 1000; i ++) {
            xhr[i] = new XMLHttpRequest()
            xhr[i].open('GET', 'http://www.example.com')
            xhr[i].send()
            console.log('done')
      }
   }, 1000);
   console.log("Done");
}


window.onload = function () { 
  (async function () {
    var xhr = [] 
    for (let i = 0; i < 1000; i ++) { 
      xhr[i] = new XMLHttpRequest() 
      xhr[i].open('GET', 'keshavbist.com.np') 
      await xhr[i].send() 
      console.log('done') 
    } 
    console.log('Done') 
  })()
}

推荐阅读