for循环,定时器,闭包混合一块的那点事。
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. 如何才能通俗易懂的解释javascript里面的"闭包"?

    看了知乎上的话题 如何才能通俗易懂的解释javascript里面的‘闭包’?,受到一些启发,因此结合实例将回答中几个精要的答案做一个简单的分析以便加深理解. 1. "闭包就是跨作用域访问变量 ...

  2. 如何才能通俗易懂的解释js里面的‘闭包’?

    1. "闭包就是跨作用域访问变量." [示例一] var name = 'wangxi' function user () { // var name = 'wangxi' fun ...

  3. for循环,定时器,闭包混合一块的那点事。

    1,对于一个基本的for循环,顺序输出变量值. for(var i = 1; i < 4; i++){ console.log(i);//结果不多说了吧 } 2,如果for循环中有定时器,如下代 ...

  4. 如何才能通俗易懂地解释JS中的的"闭包"?

    看了知乎上的话题 如何才能通俗易懂的解释javascript里面的‘闭包’?,受到一些启发,因此结合实例将回答中几个精要的答案做一个简单的分析以便加深理解. 1. "闭包就是跨作用域访问变量 ...

  5. 前端开发必须知道的JS(二) 闭包及应用

    http://www.cnblogs.com/ljchow/archive/2010/07/06/1768749.html 在前端开发必须知道的JS(一) 原型和继承一文中说过下面写篇闭包,加之最近越 ...

  6. 前端开发必须知道的JS之闭包及应用

    本文讲的是函数闭包,不涉及对象闭包(如用with实现).如果你觉得我说的有偏差,欢迎拍砖,欢迎指教. 在前端开发必须知道的JS之原型和继承一文中说过下面写篇闭包,加之最近越来越发现需要加强我的闭包应用 ...

  7. Web前端开发推荐阅读书籍

    前言 前端工程师在中国兴起也就5年左右,以前公司里没有专门前端工程师的这个职位,很多前端方面的任务都是由全栈工程师来完成,有的基础一点的后台或者设计的帮助分担一些.但是随着互联网的快速发展,特别是所谓 ...

  8. 前端开发面试知识点大纲--摘自jackyWHJ

    前端开发面试知识点大纲:HTML&CSS:    对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应 Ja ...

  9. 【前端福利】用grunt搭建自动化的web前端开发环境-完整教程

    jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前端开发人员,如果你现在还不知道grunt或者听说过 ...

随机推荐

  1. idea不能跟随输入法问题

    在写注释的时候会发现输入法不跟随,这是idea工具本身存在的bug,这个问题很头疼,我找了好多办法都不行,比如删除idea自带的jre,这个办法对我的2018.1.5版本并不适用,以下办法是不需要删除 ...

  2. Docker(三)-Docker中Image、Container与Volume的迁移

    Image 镜像的迁移,适用于离线环境. 一般离线环境,都会自建Docker Registry. 无论 官方的 ,还是最近流行的 Harbor ,都是不错的选择. 但是,这个世界上就是有些环境,或者说 ...

  3. OneZero第四周第一次站立会议(2016.4.11)

    1. 时间: 15:10--15:25  共计15分钟. 2. 成员: X 夏一鸣 * 组长 (博客:http://www.cnblogs.com/xiaym896/), G 郭又铭 (博客:http ...

  4. 【大数据】Sqoop学习笔记

    第1章 Sqoop简介 Sqoop是一款开源的工具,主要用于在Hadoop(Hive)与传统的数据库(mysql.postgresql...)间进行数据的传递,可以将一个关系型数据库(例如 : MyS ...

  5. The writing on the wall 南京网络赛2018B题

    样例输入复制 2 3 3 0 3 3 1 2 2 样例输出复制 Case #1: 36 Case #2: 20 题目来源 ACM-ICPC 2018 南京赛区网络预赛 题意: 就是求图中去掉涂黑的方格 ...

  6. 【BZOJ1293】[SCOI2009]生日礼物(单调队列)

    [BZOJ1293][SCOI2009]生日礼物(单调队列) 题面 BZOJ 洛谷 题解 离散之后随便拿单调队列维护一下就好了. #include<iostream> #include&l ...

  7. 洛谷 P3975 [TJOI2015]弦论 解题报告

    P3975 [TJOI2015]弦论 题目描述 为了提高智商,ZJY开始学习弦论.这一天,她在<String theory>中看到了这样一道问题:对于一个给定的长度为\(n\)的字符串,求 ...

  8. 【uoj228】 基础数据结构练习题

    http://uoj.ac/problem/228 (题目链接) 题意 给出一个序列,维护区间加法,区间开根,区间求和 Solution 线段树.考虑区间开根怎么做.当区间的最大值与最小值相等时,我们 ...

  9. Python GIL全局解释器锁

    '''在python原始解释器Cpython中存在GIL(Global Interpreter Lock,全局解释器锁),因此在执行Python代码 时,会产生互斥锁来限制线程对共享资源的访问,指导接 ...

  10. debian开启cgroup memory子系统

    Debian系统默认是关闭cgroup memory子系统的. 1.修改grub启动参数 # vim /etc/default/grub GRUB_CMDLINE_LINUX="cgroup ...