for-loop-with-async.js

const array = [1, 2, 3, 4, 5]

const fetchData = i => {
  console.log(`fetching ${i}...`)
  return new Promise(resolve =>
    setTimeout(() => {
      console.log(`finished ${i}`)
      resolve()
    }, 1000)
  )
}

const generateRequests = async () => {
  // for await ..of execute async request in series
  // will only start the next async request after the previous one finishes
  for await (let i of array) {
    await fetchData(i)
  }

  // works the same way as for...of
  for (let i of array) {
    await fetchData(i)
  }
  
  // Promise.all will start all the async request in parallel 
  return Promise.all(array.map(i => fetchData(i)))
  
  // UnhandledPromiseRejectionWarning: TypeError: undefined is not iterable
  return Promise.all(array.forEach(i => fetchData(i)))
  
  // done will be called before all the requests finsih
  return array.map(i => fetchData(i))
  return array.forEach(i => fetchData(i))
}

;(async () => {
  console.log('start')
  await generateRequests()
  console.log('done')
})()

Related reads:

• https://zellwk.com/blog/async-await-in-loops/
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for-await...of