for循环中的setTimeout的几种情况

news2024/9/22 23:33:46

for循环中的setTimeout的几种情况


在做js相关的题目时,经常会遇到以下几种容易混淆的setTimeout相关的题目:
第一种

for(var i=0;i<10;i++){
    setTimeout(console.log(i),0);
}

在这里插入图片描述
在这个代码片段中,setTimeout 的第一个参数是 console.log(i),这是一个立即执行的函数调用,而不是一个回调函数。因此,console.log(i) 会立即执行,并且 setTimeout 的第二个参数 0 实际上没有任何意义,因为 console.log(i) 已经立即执行了。
所以,这个代码片段实际上等同于:

for(var i=0;i<10;i++){
    console.log(i);
}

let同理
第二种:

for(var i=0;i<10;i++){
    setTimeout(function(){
        console.log(i); 
    },0);
}

在这里插入图片描述
在这个代码片段中,setTimeout 的第一个参数是一个匿名函数 function(){ console.log(i); },这是一个回调函数。这个回调函数会在 setTimeout 的延迟时间(这里是 0 毫秒)之后执行。
由于 var 声明的变量 i 是函数作用域(在 ES5 及之前),而不是块级作用域,所以在 for 循环结束后,i 的值是 10。当 setTimeout 的回调函数执行时,它们都会引用同一个 i,而这个 i 的值已经是 10。
第三种:

for(var i=0;i<10;i++){
    setTimeout('console.log(i)',0);  //10个10
}

循环执行:for 循环从 i=0 开始,每次循环 i 递增 1,直到 i<10 不成立为止。在每次循环中,都会调用 setTimeout,并传入一个字符串 ‘console.log(i)’ 作为回调函数,延迟时间为 0 毫秒。
字符串作为回调函数:当 setTimeout 的第一个参数是一个字符串时,JavaScript 会将其视为一个代码字符串,并在延迟时间结束后使用 eval 来执行这个字符串。这意味着在延迟时间结束后,eval 会执行 console.log(i),但此时 i 的值已经是 10,因为循环已经结束。
let同理
第四种:

for(let i=0;i<10;i++){
    setTimeout(function(){
        console.log(i);  
    },0);
}

在这里插入图片描述
循环执行:for 循环从 i=0 开始,每次循环 i 递增 1,直到 i<10 不成立为止。在每次循环中,都会调用 setTimeout,并传入一个匿名函数 function(){ console.log(i); } 作为回调函数,延迟时间为 0 毫秒。
变量作用域:使用 let 声明的变量 i 具有块级作用域。这意味着每次循环都会创建一个新的 i,并且每个 i 的作用域仅限于当前循环迭代。
回调函数执行:由于 let 具有块级作用域,每次循环都会创建一个新的 i,因此每个回调函数都会捕获到对应的 i 值。
当每个回调函数执行时,console.log(i) 会输出当前循环迭代对应的 i 值。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1990043.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Qt QTableWidget 去除序号列

ui->tableWidget->verticalHeader()->setHidden(true);//垂直序列号&#xff08;表左侧&#xff09;ui.tableWidget->horizontalHeader()->setHidden(true);//水平序列号&#xff08;表上方&#xff09;删除后效果图&#xff1a;

Aurora64B 66B IP的原理及示例工程分析(高速收发器二十四)

点击进入高速收发器系列文章导航界面 1、Aurora 64B/66B原理 Aurora 64B/66B的原理与Aurora 8B/10B的原理基本上一致&#xff0c;通道概述如下所示。 图1 Aurora 64B/66B概述 上图的Aurora 64B/66B Core就是该IP&#xff0c;一个IP可以驱动多个高速收发器&#xff0c;该内核的主…

虚拟机(VMware16)安装rocky9.2详细过程,附镜像下载链接

rocky官方站点 链接: 官方站点 rocky9.2镜像下载路径 链接: Rocky-x86_64-dvd.iso 打开虚拟机&#xff0c;选择新建虚拟机 新建虚拟机 选择典型 由于VMware16没有rocky的版本&#xff0c;所以我们这里选择其他liunx 5.x 内核 64位 因为rocky9默认内核版本就是5开头的&#xf…

高频焊机逆变电路谐波计算及分析

一、SPWM谐波分析 简化高频焊机逆变模块为图4-6的单相PWM逆变电路。它由一个大小为u0的直流电压源和两个桥臂组成&#xff0c;每个桥臂包括两个MOSFET全控器件&#xff0c;阻抗Z模块为逆变输出负载[26]。逆变控制器的控制算法为双极性SPWM算法&#xff0c;即通过正弦调制波和三…

Unity Addressables bundle依赖查看和资源重复查看工具

在开发的过程有时候想要知道addressables 打包出来bundles的依赖关系&#xff0c;以及资源的重复情况。直接通过自带的addressables工具查看有点困难。这里分享一个github上的开源工具。名称为UnityAddressablesBuildLayoutExplorer。该工具可以帮助查看所有文件的依赖情况&…

在Visual Studio/Qt Creator 中使用CMake安装和使用vcpkg包

文章目录 0. vcpkg简介和安装0.1 vcpkg简介0.2 vcpkg安装0.2.1 如何在Visual Studio 2022以及以上版本中安装vcpkg0.2.2 在其他VS版本或Qt Creator等平台上中安装vcpkg 1. 在Visual Studio 中使用CMake安装和使用vcpkg包1.1 创建Visual Studio项目1.2 设置项目文件a. 配置CMake…

线性方程组迭代算法的Python实现

更多精彩&#xff0c;关注博客园主页&#xff0c;不断学习&#xff01;不断进步&#xff01; 我的主页 csdn很少看私信&#xff0c;有事请b站私信 博客园主页-发文字笔记-常用 有限元鹰的主页 内容&#xff1a; ABAQUS数值模拟相关Python科学计算开源框架&#xff0c;编程…

pip 安装 scikit-learn

第一步&#xff1a;更新pip 可以首先执行 python -m ensurepip 然后执行 python -m pip install --upgrade pip 即可更新完毕。 python -m ensurepip python -m pip install --upgrade pip第二步 安装sklearn的时候一定要注意顺序。 安装顺序&#xff1a;numpy / scipy / ma…

汇编语言入门基础(访问寄存器和内存)

目录 访问寄存器和内存 2.1 寄存器是CPU内部的信息存储单元 2.1.1 通用寄存器--以AX为例 2.1.2 将AX分成AH与AL 2.2 “字”再寄存器中的存储 2.3 mov和add指令 2.3.1 练习1 2.3.2 练习2 2.4 确定物理地址的方法 2.4.1 物理地址 2.4.2 8086CPU给出物理地址的方法 2.4.…

swin和vit

参考&#xff1a;https://blog.csdn.net/weixin_44878336/article/details/125444556 Swin Transformer与Vision Transformer的对比 二者的不同之处&#xff1a; Swin-Transformer所构建的特征图是具有层次性的&#xff0c;很像我们之前将的卷积神经网络那样&#xff0c;随着…

基于检索增强生成 (RAG) 的大语言模型优化研究

复旦大学的研究人员对检索增强生成技术 (RAG) 的现有方法进行了系统性的研究&#xff0c;提出了一种三步式方法来优化 RAG 框架&#xff0c;并通过实验证明了该方法在提高大型语言模型性能方面的有效性&#xff0c;特别是在多模态检索和问答方面的应用。 论文介绍 基于检索的…

HexView 刷写文件脚本处理工具-基本功能介绍(二)-导入文件

菜单 保存(Save) 在对数据进行任何修改后(例如修改十六进制行或块的基地址),保存选项将被启用。这表示文件已被修改。在这种情况下,“保存”选项允许你将数据存储到当前文件名中。Hexview会以当前文件格式写入数据。当前文件格式显示在状态行中。 另存为(Save as) 允…

LVS详细介绍及常见模式(NAT,DR,防火墙标记)实验详解

目录 一、什么是LVS 二、LVS的核心思想 三、 LVS的优势 四、LVS的调度算法 4.1. LVS的调度算法类型 4.2. LVS静态调度算法 4.3. LVS动态调度算法 4.4.在4.15版本内核以后新增调度算法 五、LVS软件相关信息 六、ipvsadm命令 七、 LVS的NAT模式实验详解 7.1实验环境 7.…

“DS18B20,感知每一度细微变化,记录每一刻温暖。”#DS18B20温度传感器

“DS18B20&#xff0c;感知每一度细微变化&#xff0c;记录每一刻温暖。”#DS18B20温度传感器 前言预备知识1.DS18B20核心参数2.DS18B20初始化函数代码编写2.1分析DS18B20初始化时序图2.2依据时序图编写相应代码 3.向DS18B20写入一个字节函数代码编写3.1分析DS18B20写时序图3.2…

Zoho工作邮箱支持哪些功能?

工作域名邮箱都有哪些常见功能呢&#xff1f;一、消息流 &#xff1b;二、邮件委托给同事代为处理&#xff1b;三、附件查看器 &#xff1b;四、在邮箱里直接和同事音频/视频通话等八大功能。 一、消息流 - 邮箱里的社交渠道 Zoho Mail等专业工作邮箱平台引入了消息流功能&…

免账户免权限免费获取 A股 全市场股票ETF指数 分钟级数据

日期 2024/8/2 意外发现的&#xff0c;抛砖引玉&#xff0c;测试了下&#xff0c;其他券商的也可以。 可以直接获取 1m 5m 1day 级别的数据&#xff0c;全A股市场的都可以。期货未测试。 需要 其他的级别的分数数据可以自行合成。 原理 券商版qmt获取行情数据时&#xff0c;不…

JavaSE之常用API(后篇)

接上篇 五、Random 5.1 使用 5.2 练习 六、包装类 6.1 是什么 包装类:封装了基本类的一些操作,更加方便使用 为了对象的完整性,更重要的是配合泛型一起使用 byte Byte short Short int Integer long Long float Float double Double boolean Boolean char Character 八种包装…

Cadence学习笔记 Day0 Cadence17.4环境安装

当然是选择“吴法安装” 直接跟着吴川斌博客的方法来就可以了&#xff0c;这里大致记录一下我的安装步骤&#xff1a; 安装许可证管理器破解许可证管理器安装软件以及补丁破解软件 获取 直接放出链接&#xff1a;吴川斌的博客 下载得到&#xff1a; 一、安装许可证管理器&am…

Redis未授权利用方式总结

前言 目前的大多数网站搭建的Redis 均采用 docker 一键部署的方式&#xff0c;而 docker 镜像中的 redis 默认不是以 root 权限运行的&#xff0c;也就是说即使拿下这台 redis&#xff0c;我们也只能在对方服务器的本地内网中漫游&#xff0c;当然还是会有部分 redis 部署在服…

Tensorflow—第四讲网络八股扩展

本讲概述 一、自制数据集 我们用六万张数字图片自制训练集&#xff0c;一万张数字图片制作测试集 代码&#xff08;注释已经很清楚了&#xff0c;就不解释了&#xff09;&#xff1a; def generateds(path, txt):f open(txt, r) # 以只读形式打开txt文件contents f.readl…