Javascript的setTimeout()使用闭包特性时需要注意的问题


Posted in Javascript onSeptember 23, 2014

setTimeout经常被用于延迟执行某个函数,用法为:

setTimeout(function(){

…

}, timeout);

有时为了进行异步处理,而使用setTimeout(function…,0);比如:

function f(){

… // get ready

setTimeout(function(){

…. // do something

}, 0);

  

return …;

}

 在setTimeout设定的函数处理器之前,函数f返回;

在使用异步处理时,尤其是使用闭包特性时,要特别小心;

例如:

for(var i = 0 ; i < 10; i++){

setTimeout(function(){

console.log(i);

}, 0);

}

对于初次使用这种方式的同学来说,很可能会认为程序会打印0…9,可结果确实打印10个10;
问题就在于,当循环完成时,function得到执行,而i已经变成10,console.log(i)中使用的是10!
 
加入你的目的是打印0…9,那么可以换一种方式,用函数参数来保存0….9(其实也是利用了闭包):

for(var i = 0 ; i < 10; i++){

setTimeout((function(i){

return function(){

console.log(i);

}

})(i), 0);

}
Javascript 相关文章推荐
jquery ajax属性async(同步异步)示例
Nov 05 Javascript
jquery showModelDialog的使用方法示例详解
Nov 19 Javascript
让alert不出现弹窗的两种方法
May 18 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
Oct 20 Javascript
jQuery分组选择器用法实例
Dec 23 Javascript
vue.js+Element实现表格里的增删改查
Jan 18 Javascript
简单的三步vuex入门
May 20 Javascript
JavaScript中var、let、const区别浅析
Jun 24 Javascript
element-ui 表格数据时间格式化的方法
Aug 24 Javascript
Bootstrap 实现表格样式、表单布局的实例代码
Dec 09 Javascript
详解Vue-Router源码分析路由实现原理
May 15 Javascript
Vue.Draggable实现交换位置
Apr 07 Vue.js
IE6 hack for js 集锦
Sep 23 #Javascript
深入理解javascript作用域和闭包
Sep 23 #Javascript
js变量、作用域及内存详解
Sep 23 #Javascript
js单独获取一个checkbox看其是否被选中
Sep 22 #Javascript
多个checkbox被选中时如何判断是否有自己想要的
Sep 22 #Javascript
js css 实现遮罩层覆盖其他页面元素附图
Sep 22 #Javascript
基于jquery的文字向上跑动类似跑马灯的效果
Sep 22 #Javascript
You might like
php绘制一条直线的方法
2015/01/24 PHP
简单谈谈php中的unicode和utf8编码
2015/06/10 PHP
PHP在innodb引擎下快速代建全文搜索功能简明教程【基于xunsearch】
2016/10/14 PHP
使用jquery与图片美化checkbox和radio控件的代码(打包下载)
2010/11/11 Javascript
JS复制到剪贴板示例代码
2013/10/30 Javascript
关于编写性能高效的javascript事件的技术
2014/11/28 Javascript
Node.js开发之访问Redis数据库教程
2015/01/14 Javascript
JavaScript数据类型学习笔记分享
2016/09/01 Javascript
JS弹出窗口的运用与技巧大全
2016/11/01 Javascript
JS实现重新加载当前页面
2016/11/29 Javascript
利用vue-router实现二级菜单内容转换
2016/11/30 Javascript
Vue.js实现价格计算器功能
2020/03/30 Javascript
vue里面父组件修改子组件样式的方法
2018/02/03 Javascript
nodejs 日志模块winston的使用方法
2018/05/02 NodeJs
vue-cli脚手架的.babelrc文件用法说明
2020/09/11 Javascript
[03:59]5分钟带你了解什么是DOTA2(第二期)
2017/02/07 DOTA
Python yield 使用浅析
2015/05/28 Python
Python在Console下显示文本进度条的方法
2016/02/14 Python
Numpy数组转置的两种实现方法
2018/04/17 Python
python获取中文字符串长度的方法
2018/11/14 Python
Python中求对数方法总结
2020/03/10 Python
jupyter 实现notebook中显示完整的行和列
2020/04/09 Python
HTML5轻松实现全屏视频背景的示例
2018/04/23 HTML / CSS
环境科学专业研究生求职信
2013/10/02 职场文书
学前教育专业毕业生自荐信
2013/10/03 职场文书
运动会广播稿200字
2014/01/15 职场文书
党支部公开承诺书
2014/03/28 职场文书
党支部承诺书范文
2014/03/28 职场文书
投资建议书模板
2014/05/12 职场文书
找工作求职信
2014/07/07 职场文书
村主任群众路线个人对照检查材料
2014/09/26 职场文书
2014年电话销售工作总结
2014/12/01 职场文书
2016同学毕业寄语大全
2015/12/04 职场文书
2016年学校“3.12”植树节活动总结
2016/03/16 职场文书
发言稿之优秀教师篇
2019/09/26 职场文书