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 相关文章推荐
JS类库Bindows1.3中的内存释放方式分析
Mar 08 Javascript
使用JavaScript switch case 另类写法
Mar 14 Javascript
JS的参数传递示例介绍
Feb 08 Javascript
javascript浏览器兼容教程之事件处理
Jun 09 Javascript
js调试工具console.log()方法查看js代码的执行情况
Aug 08 Javascript
jQuery中$.each使用详解
Jan 29 Javascript
node.js集成百度UE编辑器
Feb 05 Javascript
深入理解JavaScript系列(40):设计模式之组合模式详解
Mar 04 Javascript
浅析js绑定事件的常用方法
May 15 Javascript
微信小程序中如何使用flyio封装网络请求
Jul 03 Javascript
详解Angular cli配置过程记录
Nov 07 Javascript
浅谈vue中组件绑定事件时是否加.native
Nov 09 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
PHP学习散记_编码(json_encode 中文不显示)
2011/11/10 PHP
超小PHP小马小结(方便查找后门的朋友)
2012/05/05 PHP
php中的注释、变量、数组、常量、函数应用介绍
2012/11/16 PHP
php生成N个不重复的随机数实例
2013/11/12 PHP
PHP中Session引起的脚本阻塞问题解决办法
2014/04/08 PHP
PHP+Jquery与ajax相结合实现下拉淡出瀑布流效果【无需插件】
2016/05/06 PHP
CI框架支持$_GET的两种实现方法
2016/05/18 PHP
Laravel 关联模型-关联新增和关联更新的方法
2019/10/10 PHP
Add a Picture to a Microsoft Word Document
2007/06/15 Javascript
Javascript 刷新全集常用代码
2009/11/22 Javascript
Jquery AJAX 用于计算点击率(统计)
2010/06/30 Javascript
IE8提示Invalid procedure call or argument 异常的解决方法
2012/09/30 Javascript
JS获取当前网址、主机地址项目根路径
2013/11/19 Javascript
Javascript添加监听与删除监听用法详解
2014/12/19 Javascript
全面解析DOM操作和jQuery实现选项移动操作代码分享
2016/06/07 Javascript
jquery动态遍历Json对象的属性和值的方法
2016/07/27 Javascript
JavaScript实现复制文章自动添加版权
2016/08/02 Javascript
JavaScript实现左右下拉框动态增删示例
2017/03/09 Javascript
AngularJS之页面跳转Route实例代码
2017/03/10 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
2017/03/13 Javascript
Mac系统下Webstorm快捷键整理大全
2017/05/28 Javascript
vue实现绑定事件的方法实例代码详解
2019/06/20 Javascript
[02:06]DOTA2肉山黑名单魔法终结者 敌法师中文配音鉴赏
2013/06/17 DOTA
Python实现短网址ShortUrl的Hash运算实例讲解
2015/08/10 Python
详谈Python基础之内置函数和递归
2017/06/21 Python
Python爬虫获取整个站点中的所有外部链接代码示例
2017/12/26 Python
微信跳一跳python辅助脚本(总结)
2018/01/11 Python
Python中正则表达式的用法总结
2019/02/22 Python
REISS英国官网:伦敦High Street最受欢迎品牌
2016/12/21 全球购物
PHP引擎php.ini参数优化深入讲解
2021/03/24 PHP
爱情保证书范文
2014/02/01 职场文书
幼儿园儿童节主持词
2014/03/21 职场文书
党日活动总结
2014/05/07 职场文书
聘任证明怎么写
2015/03/02 职场文书
合同纠纷调解书
2015/05/20 职场文书
学历证明样本
2015/06/16 职场文书