for(var i=0;i<3;i++){
setTimeOut(function(){
console.log(i)
},500)
};
执行结果:3,3,3
----------------------------
JS是单线程的,意味着同一时间只能执行一条语句,所以每个JS执行代码块都会阻塞异步事件的执行,这就意味着当一个异步(鼠标点击事件,ajax,settimeout)发生的时候,他们将排在执行队列的最后等待执行.
 
所以解决方法是 写一个立即执行的匿名函数用来避免出现被for阻塞的情况:
立即执行的匿名函数写法:
(function (i){})(i);
所以上述函数应该写成:
for(var i=0;i<3;i++){
(function(i){
setTimeOut(function(){
console.log(i)
},500);
})(i);
}

关于settimeout 和for循环的更多相关文章

  1. 【转向Javascript系列】从setTimeout说事件循环模型

    本文首发在alloyteam团队博客,链接地址http://www.alloyteam.com/2015/10/turning-to-javascript-series-from-settimeout ...

  2. js: 从setTimeout说事件循环模型

    一.从setTimeout说起 setTimeout()方法不是ecmascript规范定义的内容,而是属于BOM提供的功能.查看w3school对setTimeout()方法的定义,setTimeo ...

  3. 前端开发:setTimeout与setInterval 定时器与异步循环数组

    前端开发:setTimeout与setInterval 定时器与异步循环数组 前言: 开通博客园三个月以来,随笔记录了工作中遇到的大大小小的难题,也看过无数篇令人启发的文章,我觉得这样的环境是极好的, ...

  4. 关于js中的setTimeout和setInterval

    http://ejohn.org/blog/how-javascript-timers-work 这是John的一篇博文说到setTimeout和setInterval的区别,在看js高效图形编程的时 ...

  5. Javascript中setTimeout()的用法详解

    1.SetTimeOut()       1.1 SetTimeOut()语法例子       1.2 用SetTimeOut()执行Function       1.3 SetTimeout()语法 ...

  6. setInterval()和setTimeout()的区别

    一.setInterval()函数的语法结构: setInterval(code,interval) setInterval()函数可周期性执行一段代码,也就是说代码会被周期性不断的执行下去. 函数具 ...

  7. SetTimeOut jquery的作用

    1. SetTimeOut() 1.1 SetTimeOut()语法例子 1.2 用SetTimeOut()执行Function 1.3 SetTimeOut()语法例子 1.4 设定条件使SetTi ...

  8. js中的SetTimeOut

    1. SetTimeOut()              1.1 SetTimeOut()语法例子              1.2 用SetTimeOut()执行Function           ...

  9. 以setTimeout来聊聊Event Loop

    平时的工作中,也许你会经常用到setTimeout这个方法,可是你真的了解setTimeout吗?本文想通过总结setTimeout的用法,顺便来探索javascript里面的事件执行机制. setT ...

随机推荐

  1. 开源遥感平台opticks插件开发指南

    Opticks是一款开源的遥感数据处理平台,与其同类开源软件OSSIM一样,支持种类丰富的数据文件格式,但其最大特点为设计精巧的插件开发模式,在设计技巧上,系统提供了良好的封装特性,即使插件开发者对框 ...

  2. js压缩xml字符串,将xml字符串转换为xml对象,将xml对象转换为json对象

    /** * 压缩xml字符串 */ function compressXmlStr(str){ var prefix, suffix; var i = str.indexOf("\r&quo ...

  3. form 表单跨域提交

    <!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...

  4. hibernate入门案例

    最近准备学ssh,今天学了一下hibernate,用的是hibernate4,现在已经出5了:配置文件很容易写错,写配置文件的时候尽量复制. 需要的jar包如下:(jar包我是直接放在项目工程里面了, ...

  5. Beta阶段第七次Scrum Meeting

    Beta阶段第七次Scrum Meeting 情况简述 BETA阶段第七次Scrum Meeting 敏捷开发起始时间 2016/12/20 00:00 敏捷开发终止时间 2016/12/21 00: ...

  6. HTML学习

    <!DOCTYPE html> <html> <head> <title>标题</title> <meta charset=" ...

  7. skipping the actual organic impact moderation supplied

    The most recent running footwear design has gone out. The high cost is actually $150. Expert sports ...

  8. spring boot + swagger + mysql + maven

    1.首先编写 yaml 文件,创建项目所需的接口,在swagger.io官网上生成 spring boot项目: 2.由于生成的spring boot项目是公共类的所以还需要修改成所需的项目名称,主要 ...

  9. C++构造函数2

    一.构造函数分类 普通构造函数,复制(拷贝)构造函数,赋值构造函数, #include <iostream> using namespace std; class A { public: ...

  10. ip扫描

    ipscan24 Advanced IP Scanner http://www.advanced-ip-scanner.com/cn/