当前位置: 首页 > news >正文

js中forEach回调同异步问题

js中forEach本身是同步的
举个栗子:

[many, too many, so many].forEach((value) => {
    some code;  //  这是一个大数值运算(非异步代码),需要几毫秒的时间
});
other code;  // 这些代码将会阻塞,等到forEach循环完之后执行

这是回调中没有异步代码的情况。

再举一个有异步的

[1, 2, 3].forEach((value) => {
    setTimeout(function() {
        some code;
    }, 1000);
});
other code; // 这部分代码不会被setTimeout阻塞,forEach遍历完1,2,3之后就执行

[1, 2, 3].forEach( async (value) => {
    let foo = await promiseFn();
});
other code; // 同样不会受到异步阻塞

上面是2种异步代码形式, 但是都不会阻塞后面的代码。我理解的是:forEach的回调函数会被立即执行,回调里有异步代码,根据EventLoop机制放入调用栈,继续执行同步代码以结束; 回调本身就是异步函数,放入调用栈,结束本次遍历。

结合代码理解:

Array.prototype.forEach = function (callback) {
    for(let index = 0; index < this.length; index++) {
        callback(this[index], index, this);
    }
}

对于常规for循环

const sleep = (timer) => {
    return new Promise((resolve, reject) => {
        setTimeout(resolve, timer);
    });
}

const foo = async () => {
    for (let i = 0; i < 5; i++) {
        await sleep(1000);
        console.log(i);
    }
}

foo(); // 从1到5,每隔一秒输出一个数字

相关文章:

  • 整行读字符串且需分割计算字符串个数
  • 比特大陆新一轮裁员50%,回应称系人员调整
  • zabbix linux系统模板更新
  • 2019.2.20 c++ 知识梳理
  • 微信全局登录设计与实现
  • 朝鲜APT集团Lazarus通过KEYMARBLE Backdoor瞄准俄罗斯组织
  • Less 日常用法
  • 手机端车牌号码键盘的vue组件
  • 回归生活:清理微信公众号
  • Cisco Nexus 系列交换机NX-OS升级
  • React开发实战
  • 工作中总结前端开发流程--vue项目
  • Java各种IO流的总结
  • MySQL-事务管理(基础)
  • Vultr 教程目录
  • 分享的文章《人生如棋》
  • 【css3】浏览器内核及其兼容性
  • ABAP的include关键字,Java的import, C的include和C4C ABSL 的import比较
  • android高仿小视频、应用锁、3种存储库、QQ小红点动画、仿支付宝图表等源码...
  • angular2开源库收集
  • Docker入门(二) - Dockerfile
  • HTML-表单
  • js中的正则表达式入门
  • Laravel深入学习6 - 应用体系结构:解耦事件处理器
  • python学习笔记-类对象的信息
  • 创建一种深思熟虑的文化
  • 从@property说起(二)当我们写下@property (nonatomic, weak) id obj时,我们究竟写了什么...
  • 大型网站性能监测、分析与优化常见问题QA
  • 经典排序算法及其 Java 实现
  • 开源SQL-on-Hadoop系统一览
  • 猫头鹰的深夜翻译:Java 2D Graphics, 简单的仿射变换
  • 容器服务kubernetes弹性伸缩高级用法
  • 使用权重正则化较少模型过拟合
  • 延迟脚本的方式
  • 远离DoS攻击 Windows Server 2016发布DNS政策
  • 智能合约开发环境搭建及Hello World合约
  • Java性能优化之JVM GC(垃圾回收机制)
  • Prometheus VS InfluxDB
  • Redis4.x新特性 -- 萌萌的MEMORY DOCTOR
  • ​软考-高级-信息系统项目管理师教程 第四版【第14章-项目沟通管理-思维导图】​
  • ### Cause: com.mysql.jdbc.exceptions.jdbc4.MySQLTr
  • #快捷键# 大学四年我常用的软件快捷键大全,教你成为电脑高手!!
  • (4)STL算法之比较
  • (42)STM32——LCD显示屏实验笔记
  • (day 12)JavaScript学习笔记(数组3)
  • (react踩过的坑)antd 如何同时获取一个select 的value和 label值
  • (草履虫都可以看懂的)PyQt子窗口向主窗口传递参数,主窗口接收子窗口信号、参数。
  • (附源码)springboot 智能停车场系统 毕业设计065415
  • (更新)A股上市公司华证ESG评级得分稳健性校验ESG得分年均值中位数(2009-2023年.12)
  • (剑指Offer)面试题34:丑数
  • (原创)Stanford Machine Learning (by Andrew NG) --- (week 9) Anomaly DetectionRecommender Systems...
  • (转)微软牛津计划介绍——屌爆了的自然数据处理解决方案(人脸/语音识别,计算机视觉与语言理解)...
  • (最优化理论与方法)第二章最优化所需基础知识-第三节:重要凸集举例
  • .NET 设计模式—适配器模式(Adapter Pattern)
  • .Net8 Blazor 尝鲜