关于不能在forEach中使用await的问题

在一次开发中，写了类似下面的代码

const arr = [3,2,1] 数组中的具体内容就不写了 ，只需知道arr是一个数组就行
遍历数组
arr.forEeach(async() =>{
const data = await getData()  // 
console.log(""start,res)
})

console.log("end")

function getData(x) {
 return new Promise((resolve, reject) => {
  setTimeout(() => {
   resolve(x)
  }, 500 * x)
 })
}

预计的输出结果是

3
2
1
end

实际上的结果是 1,2,3 end

原因是 forEach 只支持同步代码。不会去处理异步的情况。

解决办法
当然你可以使用 Promise.all，但是感觉比较麻烦
所有我使用的是 for…of 来解决

async function test() {
 let arr = [3, 2, 1]
 for (const item of arr) {
  const res = await fetch(item)
  console.log(res)
 }
 console.log('end')
}
这样就可有正常输出了

原因是 for…of 内部处理的机制和 forEach 不同，forEach 是直接调用回调函数，for…of 是通过迭代器的方式去遍历。