1,对于一个基本的for循环,顺序输出变量值。

        for(var i = 1; i < 4; i++){
console.log(i);//结果不多说了吧
}

2,如果for循环中有定时器,如下代码。

        for (var i = 1; i < 4; i++) {
setTimeout(function() {
console.log(i);//3个4
}, 3000);
}

初衷想要3s后输出1,2,3。但是3s后,输出3个4。原因是定时器的异步执行,for循环的执行速度很快,当真正执行到函数体时,此时i早已变成4,所以结果不想而知。

3,如果要得到正确结果,就要引入闭包来保存变量i不被销毁。

        for (var i = 1; i < 4; i++) {
(function(a) {
setTimeout(function() {
console.log(a);//操纵变量a,和i无关
}, 3000);
})(i)
}

这样引入闭包,变量i保存下来,3s后函数体执行,输出1,2,3.

也可以这样写

         for (var i = 1; i < 4; i++) {
setTimeout(fn(i), 3000);
}
function fn(a){
return function(){
console.log(a);
}
}

4,如果要实现,没隔3s输出一个数字,即,3s输出1,3s后再输出2...,就要对定时器时间设置

        for (var i = 1; i < 4; i++) {
(function(a) {
setTimeout(function() {
console.log(a);
}, a*3000); //.....
})(i)
}

实际上,for循环很快,上述代码类似于同时启动3个定时器,只需要确保时间不一样即可。在此,时间分别是3s,6s,9s,由于同时启动,但是执行时间不同,各个时间间隔都是3s。巧妙地达到了目的。

后续如果有补充,会继续添加...

for循环,定时器,闭包混合一块的那点事。的更多相关文章

  1. 【前端开发】关于闭包最通俗易懂的解释 for循环,定时器,闭包混合一块的那点事。

    for循环,定时器,闭包混合一块的那点事. 1,对于一个基本的for循环,顺序输出变量值. for(var i = 1; i < 4; i++){ console.log(i);//结果不多说了 ...

  2. 说说循环与闭包——《你不知道的JS》读书笔记(一)

    什么是闭包 <你不知道的JS>里有对闭包的定义:"当函数可以记住并访问所在的词法作用域,即使函数是在当前作用域之外执行,这就产生了闭包." 讲闭包是啥的太多了...就一 ...

  3. [浪风推荐]javascritp中倒计定时器和循环定时器

    在javascritp中,有两个关于定时器的专用函数,分别为: 1.倒计定时器:timename=setTimeout(“function();”,delaytime); 2.循环定时器:timena ...

  4. JavaScript中的循环和闭包

    看一段比较经典的错误代码: // 希望获取页面上的所有div,在点击的时输出对应的编号 var oDom = document.querySelectorAll("div"); / ...

  5. golang 循环创建闭包 问题排查

    ][]string{ { { "邀请码是什么", "我没有邀请码", "这个邀请码我可以随便填吗", "邀请码可以填他的手机号吗& ...

  6. python 循环定时器

    有时候需要循环执行某个任务,最简单的就是用thread.Timer. 谷歌了一下,发现大家竟然用sleep 来实现循环,也不知道谁想的这个方法,竟然很少有人想到join一下,很奇怪. # -*- co ...

  7. JS setInterval 循环定时器的使用 以及动态倒计时展示

    例: var setTime = setInterval(function () { ff(); //每秒调用的方法函数 }, 1000); //1000毫秒为1秒 //可使用 clearInterv ...

  8. java循环定时器@Scheduled的使用

    @Scheduled 注解 用于定时循环执行任务 例如: @Scheduled(cron="0 */10 * * * ?") 表示每隔十分钟执行一次 每隔5秒执行一次:" ...

  9. For循环和闭包问题

    考虑一下以下的代码片段: for (var i = 0; i < 5; i++) { var btn = document.createElement('button'); btn.append ...

随机推荐

  1. POJ1258:Agri-Net(最小生成树模板题)

    http://poj.org/problem?id=1258 Description Farmer John has been elected mayor of his town! One of hi ...

  2. 使用gunicorn部署Flask项目

    [*] 本文出处:http://b1u3buf4.xyz/ [*] 本文作者:B1u3Buf4 [*] 本文授权:禁止转载 从自己的博客移动过来. gunicorn是一个python Wsgi的WEB ...

  3. CentOS6.5安装HBase集群及多HMaster配置

    1.配置SSH免登录 请参考:http://www.cnblogs.com/hunttown/p/5470357.html 服务器配置: Hadoop-NN-01 主Hadoop-NN-02 备Had ...

  4. Python tricks(7) -- new-style class的__slots__属性

    __slots__是在python 2.2开始引入的一个新特性, 我们来看一下官方给出的解释. This class variable can be assigned a string, iterab ...

  5. 又一国产855旗舰突然现身:支持5G

    12月28日消息,中国联通官方微博放出了vivo NEX 5G版样机.如图所示,该机搭载骁龙855移动平台及X50 5G调制解调器. 早在8月30日,vivo就宣布完成了面向商用5G智能手机的软硬件开 ...

  6. MySQL数据库----IDE工具介绍及数据备份

    一.IDE工具介绍 生产环境还是推荐使用mysql命令行,但为了方便我们测试,可以使用IDE工具 下载链接:https://pan.baidu.com/s/1bpo5mqj 二.MySQL数据备份 # ...

  7. redhat6.4 elasticsearch1.7.3安装配置

    利用elasticsearch管理集群索引, 今天刚好需要重新调整elasticsearch的最大内存, 所以自己安装了练手 附件: elasticsearch 附件:elasticsearch-he ...

  8. php在Nginx环境下进行刷新缓存立即输出,实现常驻进程轮询。

    以下面这段代码并不会逐个输出,而是当浏览器筹够一定字节数进行统一输出,结果显而易见,10秒后一次性输出所有内容 for($i=0;$i<10;$i++){ echo $i.'</br> ...

  9. 20145127《java程序设计》第四周学习总结

    教材学习内容总结 第六章 继承与多态 6.1 何为继承 0.面向对象中,子类继承父类,避免城府的行为定义.正确判断使用继承的时机,以及继承之后如何活用多态,才是学习继承时的重点. 1.继承:避免多个类 ...

  10. 20145337《网络对抗技术》逆向及BOF基础

    20145337<网络对抗技术>逆向及BOF基础 实践目标 操作可执行文件pwn1,通过学习两种方法,使main函数直接执行getshall,越过foo函数. 实践内容 手工修改可执行文件 ...