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 相关文章推荐
Javascript的闭包
Dec 31 Javascript
可在线编辑网页文字效果代码(单击)
Mar 02 Javascript
JQuery对表格进行操作的常用技巧总结
Apr 23 Javascript
jquery+html5烂漫爱心表白动画代码分享
Aug 24 Javascript
全屏js头像上传插件源码高清版
Mar 29 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
Angular.js中控制器之间的传值详解
Apr 24 Javascript
微信小程序滚动Tab实现左右可滑动切换
Aug 17 Javascript
利用10行js代码实现上下滚动公告效果
Dec 08 Javascript
js获取html页面代码中图片地址的实现代码
Mar 05 Javascript
JS实现马赛克图片效果完整示例
Apr 13 Javascript
JavaScript实现优先级队列
Dec 06 Javascript
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
追求程序速度,而不是编程的速度
2008/04/23 PHP
PHP版网站缓存加快打开速度的方法分享
2012/06/03 PHP
ThinkPHP5实现作业管理系统中处理学生未交作业与已交作业信息的方法
2016/11/12 PHP
CI框架(CodeIgniter)实现的导入、导出数据操作示例
2018/05/24 PHP
基于jQuery的消息提示插件之旅 DivAlert(三)
2010/04/01 Javascript
IE6下CSS图片缓存问题解决方法
2010/12/09 Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
2013/07/16 Javascript
Jqgrid表格随窗口大小改变而改变的简单实例
2013/12/28 Javascript
jquery实现点击弹出层效果的简单实例
2014/03/03 Javascript
jquery.fastLiveFilter.js实现输入自动过滤的方法
2015/08/11 Javascript
JS处理json日期格式化问题
2015/10/01 Javascript
为输入框加入数字js校验代码分享
2017/11/02 Javascript
实例讲解JavaScript预编译流程
2019/01/24 Javascript
原生JS实现图片懒加载之页面性能优化
2019/04/26 Javascript
一些可能会用到的Node.js面试题
2019/06/15 Javascript
移动端吸顶fixbar的解决方案详解
2019/07/17 Javascript
聊聊Vue中provide/inject的应用详解
2019/11/10 Javascript
微信小程序基于高德地图API实现天气组件(动态效果)
2020/10/22 Javascript
linux 下实现python多版本安装实践
2014/11/18 Python
Python正则抓取网易新闻的方法示例
2017/04/21 Python
Python替换月份为英文缩写的实现方法
2019/07/15 Python
使用pyinstaller逆向.pyc文件
2019/12/20 Python
Python实现动态给类和对象添加属性和方法操作示例
2020/02/29 Python
基于Keras中Conv1D和Conv2D的区别说明
2020/06/19 Python
python如何爬取动态网站
2020/09/09 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
css3 给页面加个半圆形导航条主要利用旋转和倾斜样式
2014/02/10 HTML / CSS
教育孩子心得体会
2014/01/01 职场文书
结婚邀请函范文
2014/01/14 职场文书
《梅兰芳学艺》教学反思
2014/02/24 职场文书
护士演讲稿优秀范文
2014/04/30 职场文书
优秀乡村医生事迹材料
2014/05/28 职场文书
2014年网络管理员工作总结
2014/12/01 职场文书
收银员岗位职责
2015/02/03 职场文书
uni-app 微信小程序授权登录的实现步骤
2022/02/18 Javascript
我们认为中短波广播场强仪的最佳组合
2022/04/05 无线电