map/forEach中使用async...await为什么无效

hhh

已于 2023-11-08 09:13:05 修改

阅读量1.1k

点赞数 1

CC 4.0 BY-SA版权

文章标签： javascript 前端

于 2023-03-15 14:23:30 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_43978501/article/details/129554198

文章讲述了在JavaScript中，由于map和forEach不支持异步操作，导致async/await无法正常等待请求完成。解决方案包括使用for循环或Promise.all。for循环逐个执行请求，Promise.all则并行处理所有请求并等待全部完成。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

第一次在map循环中写请求用了async…await，发现请求并没有生效（forEach也是一样），以下是原因和解决方法。

1、原因：
map/forEach内部使用了while和callback方式来执行函数，await不会等待callback的执行。

2、解决方法：
（1）使用for循环

const handleRequest = async () => {
	const arr = [1,2,3,4]; 
	for (let i = 0; i < arr.length; i++) {
	    await API.GETRADARPNG().then();//你的请求方法
	}
}

（2）使用promise.all()

const handleRequest = async () => {
   const resArr = await Promise.all(
     arr.map(async (v) => {
       await API.GETRADARPNG().then();//你的请求方法
     })
   );
   return resArr;
};

旨在分享~~~~~