两道经典的面试题,直接上代码

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

会输出什么呢?先想一想,记下答案。继续下一题

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

改动很少,结果却相差甚远。先公布正确答案,第一段代码输出:1,2,4,8; 第二段代码输出:3,6,12,24。

意不意外?刺不刺激?惊不惊喜?

【代码解析】

  首先,不要被定时器干扰,误以为它有延迟才会导致这样的结果,你可以尝试把延迟改成“0”或者去掉不写,结果依然相同。

  引入一个概念-->异步,脱离当前事件队列的处理程序,而且必须等到正常队列里的事件完成后才会执行。

    再来分析以上代码,

     第一个,看到setTimeout,就知道知道它会在代码块的for循环及最后一个console.log完成后才执行,而且执行三次。毫无疑问,会先输出1,此时 i 的值为 1,再开始执行setTimeout进程,分别输出2,4,8.

       第二个,需要对闭包有一定理解,js中的for循环是不存在私有作用域的,所以for循环最后结束时 i = 3,然后再执行setTimeout,依次是6,12,24.

setTimeout异步加载的更多相关文章

  1. 向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)[上拉加载组件]

    /**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name a ...

  2. JS -- 异步加载进度条

    今天在博客园问答里面看到博友问道怎么实现Ajax异步加载产生进度条. 很好奇就自己写了一个. 展现效果: 1) 当点击Load的时候,模拟执行异步加载. 浏览器被遮挡. 进度条出现. 实现思路: 1. ...

  3. iframe异步加载技术及性能

    我们会经常使用iframes来加载第三方的内容.广告或者插件.使用iframe是因为它可以和主页面并行加载,不会阻塞主页面.当然使用iframe也是有利有弊的:Steve Souders在他的blog ...

  4. 动态加载(异步加载)jquery/MUI类库 页面加载完成后加载js类库

    动态加载Mui类库: // ==UserScript== // @name // @version 1.4.0 // @author zzdhidden@gmail.com // @namespace ...

  5. 深入理解JS异步编程五(脚本异步加载)

    异步脚本加载 阻塞性脚本 JavaScript在浏览器中被解析和执行时具有阻塞的特性,也就是说,当JavaScript代码执行时,页面的解析.渲染以及其他资源的下载都要停下来等待脚本执行完毕 浏览器是 ...

  6. echarts异步加载柱状图遇到的错误- Error: Component series. not exists. Load it first.

    今天看了下echarts教程之中的异步加载柱状图,我按照教程中的代码敲出来之后再运行,就报了一个 Error: Component series. not exists. Load it first. ...

  7. Javascript 异步加载详解(转)

    本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属 ...

  8. Javascript 异步加载详解

    Javascript 异步加载详解 本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy ...

  9. javascript异步加载详解(转)

    本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属 ...

随机推荐

  1. 大麦盒子(domybox)无法进入系统解决方案!【简单几步】

    大麦无法进入系统解决方案![简单几步]前提准备:电脑一台盒子控制台软件盒子开机并联网并且盒子和电脑处于同一个路由器下的网络! 前提准备:电脑一台盒子控制台软件盒子开机并联网并且盒子和电脑处于同一个路由 ...

  2. 200_longest-palindromic-substring

    /*@Copyright:LintCode@Author:   Monster__li@Problem:  http://www.lintcode.com/problem/longest-palind ...

  3. C#小知识点记录,对象的深拷贝

    在CSDN中的定义是: public static string CompareExchange( ref string location1, string value, string compara ...

  4. Unity 相机的聚焦功能

    摘要:本文原创,转载请注明出处 需求: 在游戏的任务编辑场景进行编辑的时候,摄像机需要在多个需要编辑的物体之间来回切换,如果只是用摄像机的移动旋转,对于相对位置较近的物体还好说,当相对位置过远的时候, ...

  5. linux下删除乱码文件、目录

    由于编码原因,在linux服务器上上传.创建中文文件或目录时,会产生乱码,如果想删除它,发现用rm命令是删除不了的 这种情况下,用find命令可以删除乱码的文件或目录. 首先进入乱码文件或目录所在的目 ...

  6. 图零直播新闻发布会—TOLINK2.0全面上线

    在网络直播时代和现代信息技术条件下,教务管理正在由传统管理方式向数字化管理模式转变.教务管理创新需要现代信息技术来实现,使得教务管理的质量和效率得到了质的飞跃.图零直播,中国IT在线直播教育引领者,在 ...

  7. Docker - 虚拟网桥

    容器的网络模式 None --- 容器不能访问外部网络,内部存在回路地址. Container --- 将容器的网络栈合并到一起,可与其他容器共享网络. Host --- 与主机共享网络. Bridg ...

  8. Docker - 容器互联

    容器互联 通过docker run命令的--link参数可以让容器之间通过连接(linking)系统进行交互. 参数格式:--link name:alias ,name是要链接的容器名称, alias ...

  9. silverlight WPF 水纹文本框

    silverlight3取消了watertextbox控件,只有自己实现了个,实现了和textbox一样的无差异使用,只需要设置defaulttext就可以了 using System; using ...

  10. Windows安装Mysql5.7.10绿色版

    今天在Windows上安装Mysql的时候,去官网上下了一个最新版本的Mysql5.7.10绿色版,但是之前网上安装方式都过时了,比如会报一些常见的错误“[ERROR] Fatal error: Ca ...