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

输出了8次8,这跟js的执行顺序和作用域链有关。

  规则:

  同步优先、异步靠边、回调垫底。    

  用公式表达就是:同步 => 异步(定时器  or  异步请求) => 回调

1、js同步执行与异步执行
js的执行机制: js是单线程环境,从上到下、依次执行,即 同步执行;在这段代码中,for循环是同步代码,setTimeout是异步代码。
js在执行代码的过程中,碰到同步代码会依次执行,碰到异步代码就会将其放入任务队列中进行等待,当同步代码执行完毕后再开始执行异步代码,即 异步执行。

2、js作用域问题
当同步代码执行完毕后,开始执行异步的setTimeout代码,执行setTimeout时需要从当前作用域内寻找一个变量 i ,此时for循环已执行完毕,当前 i=8,所以执行setTimeout时输出为8,任务队列中的剩余7个setTimeout也依次执行,输出为8。

3、常用解决方法
利用立即执行函数,当for循环执行时,就会立即执行setTimeout,从而使得到的每个副本i值都不一样,这样就可以得到想要的for循环的结果。如:

for(var i=0;i<8;i++){
(function (x) {
setTimeout(function () {
console.log(x)
},0)
})(i);
}
参考:
https://blog.csdn.net/ld767416042/article/details/84030668
https://www.cnblogs.com/wangwenhui/p/7657654.html
https://blog.csdn.net/huakaiwuxing/article/details/78968642

https://baijiahao.baidu.com/s?id=1621653715044760064&wfr=spider&for=pc

https://blog.csdn.net/u010297791/article/details/71158212

https://blog.csdn.net/jssy_csu/article/details/78627628

for循环中执行setTimeout问题(任务队列的问题)的更多相关文章

  1. for循环中执行setTimeout问题

    代码片段: for(var i=0;i<8;i++){ setTimeout(function () { console.log(i) },0) } 输出了8次8,这跟js的执行顺序和作用域链有 ...

  2. JS中For循环中嵌套setTimeout()方法的执行顺序

    在For循环中执行setTimeOut()方法的代码,执行顺序是怎样的呢? 代码如下 function time() { for(var i= 0;i<5;i++){ setTimeout(fu ...

  3. for循环中嵌套setTimeout,执行顺序和结果该如何理解?

    这两天在捣鼓作用域的问题,有的时候知识这个东西真的有点像是牵一发而动全身的感觉.在理解作用域的时候,又看到了一道经典的面试题和例子题. 那就是在for循环中嵌套setTimeout延时,想想之前面试的 ...

  4. 能不能在FOR循环中执行SQL?

    JDBC最基础的For循环处理SQL的方式 以及执行时间 package javaee.net.cn.jdbc; import java.sql.*; public class TestTransac ...

  5. 关于for循环中使用setTimeout

    我们先来简单了解一下setTimeout延时器的运行机制.setTimeout会先将回调函数放到等待队列中,等待区域内其他主程序执行完毕后,按时间顺序先进先出执行回调函数.本质上是作用域的问题. 因此 ...

  6. 关于for循环中使用setTimeout的四种解决方案

    我们先来简单了解一下setTimeout延时器的运行机制.setTimeout会先将回调函数放到等待队列中,等待区域内其他主程序执行完毕后,按时间顺序先进先出执行回调函数.本质上是作用域的问题. 因此 ...

  7. Python自学:第四章 在for循环中执行更多操作(2)

    # -*- coding: GBK -*- magicians = ['alice', 'david', 'carolina'] for magician in magicians: print(ma ...

  8. Python自学:第四章 在for循环中执行更多操作(1)

    # -*- coding: GBK -*- magicians = ['alice', 'david', 'carolina'] for magician in magicians: print(ma ...

  9. Java 循环中标签的作用

    continue和break可以改变循环的执行流程,但在多重循环中,这两条语句无法直接从内层循环跳转到外层循环.在C语言中,可以通过goto语句实现多重循环的跳转,但在非循环结构中使用goto语句会使 ...

随机推荐

  1. JavaScript 类型浅解

    对于JavaScript 类型,可简单地概括为:相对于强类型语言来说,它是弱(松散)类型的语言:有基本类型和引用类型,他们是区别是一个有固定空间存在于栈内存中,一个没有固定空间保存在堆内存中并且在栈内 ...

  2. 系统安装1---U盘启动器制作

    1.下载PE制作工具,现在有很多的PE制作工具,如老毛桃,大白菜等.下面我使用的是IT天空的U盘PE制作工具. 下载地址:https://www.itiankong.net/thread-369670 ...

  3. Scrapy框架——安装以及新建scrapy文件

    一.安装 conda install Scrapy   :之后在按y 表示允许安装相关的依赖库(下载速度慢的话也可以借助镜像源),安装的前提是安装了anaconda作为python ,   测试scr ...

  4. Robot Framework +钉钉通知(Dingding[钉钉] Plugin)构建通知

    1.点击钉钉个人头像进入[机器人管理] 2.添加自定义机器人 3.创建机器人,选择通知群 4.完善机器人信息 5.复制机器人token(只需要连接access_token后面token) 6.进入je ...

  5. docker镜像仓库

    搭建私有镜像仓库 Docker Hub作为Docker默认官方公共镜像,如果想自己搭建私有镜像仓库,官方也提供registry镜像,使得搭建私有仓库非常简单. 下载registry镜像并启动 [roo ...

  6. javascript基础六(事件对象)

    1.事件驱动     js控制页面的行为是由事件驱动的.          什么是事件?(怎么发生的)     事件就是js侦测到用户的操作或是页面上的一些行为       事件源(发生在谁身上)   ...

  7. 初学Vue

    指令.组件.数据 指令 指令带有前缀,v-表示它们是Vue提供的特殊属性.如: v-bind:绑定元素属性,如:v-bind:title v-if:条件,绑定DOM 的结构 v-for:循环,使用Ar ...

  8. Educational Codeforces Round 69 E - Culture Code (最短路计数+线段树优化建图)

    题意:有n个空心物品,每个物品有外部体积outi和内部体积ini,如果ini>outj,那么j就可以套在i里面.现在我们要选出n个物品的一个子集,这个子集内的k个物品全部套在一起,且剩下的物品都 ...

  9. Python 第三天学习整理2

    一.常用的字符串方法 capitalize() #将字符串首字母大写 center(100,'*') #把字符串居中的 count(‘zhou’)#查询次数 endswith('.jpg ')#判断字 ...

  10. 属性class与:class

    1.官方的案例 我们可以传给 v-bind:class 一个对象,以动态地切换 class <div v-bind:class="{ active: isActive }"& ...