1:

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

或者比较正规的写法(code 加上引号):

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

控制台输出结果为 0,1,2,3,4

2:

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

控制台输出结果为 5,5,5,5,5

虽然setTimeout(code, 0)为立即执行,但由于javascript为单线程,所以还需等待循环结束后才会执行setTimeout

由于阻塞,在循环中产生的setTimeout事件会被放在执行队列中进行等待。

1中放入执行队列的是:console.log(i) ,结果为 0,1,2,3,4

2中放入执行队列的是:function(){ console.log(i); }, 结果为 5,5,5,5,5 为什么呢

原因:2放入队列的是匿名函数,等到匿名函数执行的时候,变量i已经累加到5了

有时,需要执行的代码不仅仅一句console.log(i)这么简单,那么2中要怎么才能做到输出 0,1,2,3,4

这里就讲到闭包:

内部函数可以使用外部的变量。

既然i为外部变量已经不可控,那就对i下手吧

修改如下:

function myTest(){
for(var i=0; i< 5; i++){
(function(v){
setTimeout(function(){
console.log(v)
}, 1000);
})(i); }
}
myTest();

每次循环先把立即(function(v){...})(i);把i作为参数传入闭包,就不会对变量造成污染。

当setTimeout遇到闭包的更多相关文章

  1. setTimeout 学习闭包

    @(技术笔记)[css] 学习参考网站 css 网站,可供参考 javascript学习网站 var create = function (i){ return function(){ console ...

  2. setTimeout使用闭包功能,实现定时打印数值

    我们这次使用setTimeout来实现一个按照时间定时,依次打印数值的例子.其实在早期的时候,也是我经常犯的一个错误,或者实现这种能力,似乎js比较牵强,其实是我的错,哈哈!没能理解JS强大之处.我们 ...

  3. setTimeout 与 闭包。。。

    先看下面一个比较坑的代码 for (var i=1; i<=5; i++) { setTimeout( function timer() { console.log(i); }, i*1000 ...

  4. setTimeOut和闭包

    掘金上看到一个setTimeout与循环闭包的思考题.拿过来看了下,一方面了解settimeout的运行机制,还有就是js闭包的特性.关于闭包,有如下解释: 在这里写一点我对闭包的理解.理解闭包的关键 ...

  5. 由一道面试题简单扩展 — setTimeout、闭包

    在一个前端公众号,看到这么一个号称简单的面试题: 1.以下程序输出什么? <script type="text/javascript"> function init() ...

  6. 附件1:setTimeout与闭包

    我在详细图解作用域链与闭包一文中的结尾留下了一个关于setTimeout与循环闭包的思考题. 利用闭包,修改下面的代码,让循环输出的结果依次为1, 2, 3, 4, 5 for (var i=1; i ...

  7. js闭包(三)

    场景一:采用函数引用方式的setTimeout调用 闭包的一个通常的用法是为一个在某一函数执行前先执行的函数提供参数.例如,在web环境中,一个函数作为setTimeout函数调用的第一个参数,是一种 ...

  8. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  9. 菜鸟凉经(华为、firehome、大华)

    面试通知都是前一天来的,准备的时间很少,所以表现也不是特别满意,来看面经吧: 华为一面(IT应用工程师): 1.自我介绍:(华为面试都是1对1,面前的是个温柔的小哥,挺放松的) 2.你主要会的it技术 ...

随机推荐

  1. JNDI--Java命名和目录接口

    JNDI主要用于在容器中配置某些资源,让所有项目可以使用.JNDI可以提供: 1:数据库连接池.            自定义连接池             第三方连接池 Dbcp           ...

  2. Qt5遇到的问题

    好久没用Qt了,今天又重新安装了一个,结果遇到不少问题 本机环境:VS2015,Qt5.7 装好后,就新建工程测试了一下,结果无法编译,提示 :-1: error: cannot open C:\Us ...

  3. JavaScript 本地对象、内置对象、宿主对象

    首先解释下宿主环境:一般宿主环境由外壳程序创建与维护,只要能提供js引擎执行的环境都可称之为外壳程序.如:web浏览器,一些桌面应用系统等.即由web浏览器或是这些桌面应用系统早就的环境即宿主环境. ...

  4. 总结一下apply和call的异同点

    call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就 ...

  5. Sql Server索引(转载)

    官方说法: 聚集索引 一种索引,该索引中键值的逻辑顺序决定了表中相应行的物理顺序. 聚集索引确定表中数据的物理顺序.聚集索引类似于电话簿,后者按姓氏排列数据.由于聚集索引规定数据在表中的物理存储顺序, ...

  6. php resizeimage 部分jpg文件 生成缩略图失败

    今天遇到GD的resizeimage 函数处理jpg后缀文件的缩略图的时候 提示该图片不是合法的jpg图片并报错 <b>Warning</b>: imagecreatefrom ...

  7. <Pro .NET MVC4> 三大工具之依赖注入神器——Ninject

    这篇内容是对<Pro .NET MVC4>一书中关于Ninject介绍的总结. Ninject是.NET MVC的一款开源的依赖注入工具. 使用场景:当MVC项目中使用了依赖注入技术来给程 ...

  8. 卓越网的kindle paperwhite

    卓越网的kindle paperwhite, 899元的价钱,好吸引啊,我是不是也应该买一个呢,从卓越网中看见kindle paperwhite的1代开始,一直想买,等到现在的2代也出了,也继续在考虑 ...

  9. Android 自定义回调

    刚开始接触的时候,觉得 回调 是一个很难理解的概念,之后就不停的上网查找回调的定义:(当你想要把具体的操作,让具体的人来完成,自己定义一个接口就好.使用的时候用接口,具体的人来实现你的接口,也就是实现 ...

  10. Sicily 1282. Computer Game

    题目地址:1282. Computer Game 思路: KMP算法,网上有很多资料,参考了一些网上的解题,收获很大,很感谢那些大神们!!! 通过这道题简单说说我对KMP算法的理解吧(大神们勿喷,虽然 ...