title: Fetch in loop, keep result order
body: <p>I have a situation where I need to loop through an array of URLs and fetch the result, but I need to preserve the order of requests, that is the first request should be "saved" (write to a file) first, and so on. The result from the requests are text files and their content do not have any data that reveals the original URL or order.</p>
  
  <p>I have made a demo below, which fetches dummy JSON data.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>let promises = [];
  let data = [];
  let i = 1;
  
  let headers = new Headers();
  headers.append('Content-Type', 'application/json');
  headers.append('Accept', 'application/json');
  
  const fn = async() =&gt; {
    while (i &lt; 5) {
      promises.push(
        fetch('https://reqres.in/api/users/' + i, {
          mode: 'cors',
          headers: headers
        })
        .then(response =&gt; response.json())
        .then(json =&gt; {
          data.push(json)
        })
      )
      i++;
    }
  
    await Promise.all(promises).then(() =&gt; {
      console.log(data);
    })
  }
  
  fn();</code></pre>
  </div>
  </div>
  </p>
  
  <p>If you test the above code, you can see that the results are in random order (based on id), and since the files in my original code are text files, I can't sort it after fetch.</p>