JS 循环中使用await

已于 2024-02-01 14:31:41 修改
阅读量826 收藏
点赞数
分类专栏： TS/JS 文章标签： javascript node.js
于 2023-06-25 17:59:33 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/WQearl/article/details/130962504
版权

前言：整篇文章参考原文for循环使用await，for of以及for await of ，我写这篇只是为了记录结论

1. 描述：

        程序中，有时候需要在循环中按照顺序进行数据操作，但是又有异步的动作，所以就希望用await。

2. 验证过程请参考原文 for循环使用await，for of以及for await of ，我这里只展示验证结果。

 结论：

  • for、for of、for await of是生效的，forEach的await是不生效的；
  • for、for of是await这一行代码在等待，for await of是整个for在等待；

扩展：

  • 实际开发中我们可以发现其实for、while、for in、for of、for await of使用await都是生效的；
  • 而几乎有回调的遍历方法：forEach、map、filter、reduce、some、every、find等，使用await都是不生效的；

        

前端菜鸟来报道
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
在JS循环中使用async/await的方法
10-17
async / await是ES7的重要特性之一，也是目前社区里公认的优秀异步解决方案。这篇文章主要介绍了在JS循环中使用async/await的方法,需要的朋友可以参考下
[js] for forEach for of 循环里await关键字的用法
qq_14993591的博客
11-25 721
2、forEach：循环中使用await的写法（3、for of：循环中使用await的写法（1、for：循环中使用await的写法（
js使用async/await实现for循环等待1s输出，类似于sleep效果
12-02 3997
使用到了await的思想：等待函数有返回才执行下面的代码。结果输出： 可以看到每一个都相隔1秒后才输出。
JS循环中使用async、await的正确姿势
不定时分享最优质的网络技术与教程，满满的干货。
12-15 1781
时，希望JavaScript暂停执行，直到等待 promise 返回处理结果。不支持 promise 感知，也支持。总是真的，所以所有选项都通过了过滤。循环中异步代码完全跑完之后再执行。循环等待异步结果返回之前就执行了。数组，这是因为异步函数总是返回。需要在函数中使用，因此需要在。循环中有异步代码，是可以等到。但是他不能处理回调的循环，如。JavaScript 中的。的返回结果，可以使用。
事件循环与 async/await
weixin_45543674的博客
11-17 300
本质：promise 与 事件循环
js - 关于循环中有await等待异步操作的情况
qq_43886365的博客
04-21 1381
有上传多个文件的需求，要求上传的时候要求对每一张图片打水印操作，但是打水印这个操作是异步的，想要保证图片上传的顺序和上传完成的结果；需要我们在循环中使用 await等待这些异步操作，保证他们是按照顺序依次执行完成的；会有以下几种处理方法： > 1，普通的for循环 > 2，使用 forEach( ) 循环 `注意：此方法不支持 还是异步循环的` > 3，利用promise.all( ) 方法
在 JS 循环中正确使用 async 与 await
sanstu的博客
06-05 7794
记录下工作中碰到的问题 准备一个例子 假设你需要在循环中进行请求，在请求返回结果后再进行下一个循环的请求，这里我们使用setTimeout来模拟。 在 forEach 循环中使用 await 一开始我使用的是forEach循环 我期望打印以下内容： "start" "10" "20” "30” "end” 但实际打印以下内容: "start" "end" "10" ...
JavaScript高级 async await 事件循环
ximingx
03-02 2630
所以真正耗时的操作，实际上并不是由JavaScript线程在执行的，浏览器的每个进程是多线程的，那么其他线程可以来完成这个耗时的操作，比如网络请求、定时器，我们只需要在特性的时候执行应该有的回调即可。2.在执行任何一个宏任务之前（不是队列，是一个宏任务），都会先查看微任务队列中是否有任务需要执行，也就是宏任务执行之前，必须保证微任务队列是空的，如果不为空，那么就优先执行微任务队列中的任务（回调）stack：整个Error的错误信息，包括函数的调用栈，当我们直接打印Error对象时，打印的就是stack；
“JavaScript 循环中的 ‘await‘
每天都要努力学习哦~~
01-25 1316
在JavaScript的`forEach`方法中使用`await`是无效的，因为`forEach`方法不支持异步操作的等待。`forEach`是一个数组的遍历方法，它会对数组中的每个元素依次执行提供的回调函数。而在JavaScript中，`await`关键字只能在异步函数(`async`函数)中使用，用于等待一个Promise对象的解析结果。在`forEach`的回调函数中使用`await`关键字，实际上会导致它被忽略，无法正确地等待异步操作的完成。
【面试题】在JS循环中使用await会怎么样？
web全栈开发的博客
03-02 1108
这个问题是这样产生的？某天，在学习异步的知识遇到这样一道题：使用Promise的方式，每隔一秒输出数组中一个值​}, 1000);})})复制代码那这段代码还是挺好了解的，相当于}, 1000);})}, 1000);})}, 1000);})})复制代码看完之后，我就在想，如果我在循环中，每次输出值之后停止一秒，也可以解决，于是乎就有了以下代码​resolve()}, ms)})​i++) {复制代码。
js代码-事件循环判断输出，重点async await promise
07-15
js代码-事件循环判断输出，重点async await promise
javascript之async-await简明教程
11-21
你将会从编写简单的 `async/await` 函数开始，逐步学会如何结合 `promise` 和 `await` 关键字，如何定义不同类型的 `async` 函数，如何处理错误，如何让 `await` 代码串行或并行，如何在循环中正确使用 `await`等。
JavaScript 实现每次循环都等待
gongzairen的博客
10-25 325
JavaScript 实现每次循环都等待
JavaScript 循环：如何处理 async/await
cream66的博客
06-28 523
JavaScript 循环：如何处理 async/await 同步循环 很久以前我写的循环是这样的： for (var i=0; i < array.length; i++) { var item = array[i]; // do something with item } 后来 JavaScript 提供了很多新的特性，现在我们会更倾向于用下面这种写法： array.forEach((item) => { // do something with item }); 在开发过程
js学习async/await
weixin_53296485的博客
06-08 412
async/await是ES6提供的异步编程方式，它可以更方便地描述异步操作，使代码更加简洁易读。
for 循环里的 await
m0_51056513的博客
10-02 4589
从callback到promise再到。之后的 JS 开始允许我们以一种看似顺序执行的方式书写代码，这让入门 JS 变得更简单，但在一些复杂的场景里比如 for-loop 环境里，还是会有不少坑的。
javascript中的事件循环机制
酒客的博客
11-30 1127
javaScript中的事件循环机制(Event Loop) 一、概念 ​ JavaScript 有一个基于事件循环的并发模型，事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。这个模型与其它语言中的模型截然不同，比如 C 和 Java。（摘自MDN） ​ 简单地说，对于 JS 运行中的任务，JS 有一套处理收集，排队，执行的特殊机制，我们把这套处理机制称为事件循环（Event Loop）。 单线程 ​ JS 单线程指的是 javascript 引擎（如V8）在同一时刻只能处理一个任务。 ​ 有人
关于循环里怎么正确使用await进行异步操作
まどか
06-16 5825
背景 今年因为忙（其实是懒），没怎么写博客，加上工作内容比较low 遇到的问题也low，实在没啥好写的，这次终于碰上了个有趣的问题 赶紧来写一波 问题 因为协议经常不知道为什么不给定批量删除的接口，只能自己循环单个删除，下面这种在map循环里进行await 实际上是同步操作的 aIdList.map(async (item) => { await _WebSDK.WSDK_SetDeviceConfig( 'deleteIO
vue快速入门（四十六）Router的安装与使用
最新发布
不起眼小菜菜的博客
04-26 417
步骤很详细，直接上教程……
foreach 循环调取接口 使用for await解决bug
05-10
在 JavaScript 中，使用 `for..of` 或 `forEach` 循环来遍历一个数组或一个类数组对象时，是同步地进行的。如果在循环体内部调用了异步操作（例如调用接口），则会出现问题，因为循环不会等待异步操作完成，就直接执行下一次循环，导致结果不正确。 解决这个问题的方法是使用 `for await..of` 循环，它可以用于遍历支持异步迭代的对象，例如异步生成器和异步迭代器。使用 `for await..of` 循环可以确保在每次循环中等待异步操作完成后再执行下一次循环。 以下是使用 `for await..of` 循环调用接口的示例代码： ```javascript async function fetchData() { const urls = ['api/url1', 'api/url2', 'api/url3']; for await (const data of getData(urls)) { console.log(data); } } async function* getData(urls) { for (const url of urls) { const response = await fetch(url); const data = await response.json(); yield data; } } ``` 在上面的代码中，`fetchData` 函数调用了 `getData` 函数，并使用 `for await..of` 循环遍历异步生成器返回的数据。`getData` 函数接收一个 URL 数组，并使用 `for..of` 循环遍历 URL，调用 `fetch` 方法获取数据，然后使用 `yield` 关键字返回数据给异步生成器。在 `fetchData` 函数中，`for await..of` 循环等待异步生成器返回数据，并输出到控制台。这样就可以确保在每次循环中等待异步操作完成后再执行下一次循环，避免了使用 `forEach` 循环时出现的问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值