js 定时器setTimeout无法调用局部变量的解决办法


Posted in Javascript onNovember 28, 2013

javascript中定时器setTimeout的用法一般如下,调用beginrotate之后就进入定时执行rotateloop的一个过程,如下代码:

var angle = 0; function rotateloop() { 
if (angle < 360) { 
angle++; 
//use angle 
//...... 
setTimeout("rotateloop()", 100); 
} 
} 
function beginrotate() { 
//do something 
//...... 
setTimeout("rotateloop()", 100); 
}

这段代码有一个问题,就是产生了一个全局变量angle,这显然不是好的编程习惯,所以我们想到使用内嵌函数的方式,将代码改成如下:
function beginrotate() { var angle = 0; 
function rotateloop() { 
if (angle < 360) { 
angle++; 
//use angle 
//...... 
setTimeout("rotateloop()", 100); 
} 
} 
//do something 
//...... 
setTimeout("rotateloop()", 100); 
}

这样子改了之后,发现javascript报错了,rotateloop找不到,显然setTimeout没有找到rotateloop这个局部内嵌函数,这里只要稍微改一下就可以解决这个问题了,代码如下:
function beginrotate() { var angle = 0; 
function rotateloop() { 
if (angle < 360) { 
angle++; 
//use angle 
//...... 
setTimeout(rotateloop, 100); 
} 
} 
//do something 
//...... 
setTimeout(rotateloop, 100); 
}

只需要将setTimeout的第一个参数改成函数对象,而不是字符串,就可以了。
Javascript 相关文章推荐
javascript 实现 秒杀,团购 倒计时展示的记录 分享
Jul 12 Javascript
简介JavaScript中valueOf()方法的使用
Jun 05 Javascript
瀑布流的实现方式(原生js+jquery+css3)
Jun 28 Javascript
Javascript学习之谈谈JS的全局变量跟局部变量(推荐)
Aug 28 Javascript
浅析vue component 组件使用
Mar 06 Javascript
JavaScript数据结构之优先队列与循环队列实例详解
Oct 27 Javascript
vue导出html、word和pdf的实现代码
Jul 31 Javascript
React优化子组件render的使用
May 12 Javascript
微信小程序实现授权登录
May 15 Javascript
CountUp.js数字滚动插件使用方法详解
Oct 17 Javascript
微信小程序pinker组件使用实现自动相减日期
May 07 Javascript
详解JavaScript 中的批处理和缓存
Nov 19 Javascript
jquery使用淘宝接口跨域查询手机号码归属地实例
Nov 28 #Javascript
JS小功能(checkbox实现全选和全取消)实例代码
Nov 28 #Javascript
JS小功能(onmouseover实现选择月份)实例代码
Nov 28 #Javascript
JS小功能(setInterval实现图片效果显示时间)实例代码
Nov 28 #Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
Nov 28 #Javascript
JS小功能(offsetLeft实现图片滚动效果)实例代码
Nov 28 #Javascript
JS小功能(列表页面隔行变色)简单实现
Nov 28 #Javascript
You might like
MySQL修改密码方法总结
2008/03/25 PHP
php命令行使用方法和命令行参数说明
2014/04/08 PHP
Linux下 php7安装redis的方法
2018/11/01 PHP
php使用socket调用http和smtp协议实例小结
2019/07/26 PHP
JS实现自动变化的导航菜单效果代码
2015/09/09 Javascript
jquery验证手机号是否正确实例讲解
2015/11/17 Javascript
js实现兼容IE、Firefox的图片缩放代码
2015/12/08 Javascript
JS JSOP跨域请求实例详解
2016/07/04 Javascript
jQuery遍历节点树方法分析
2016/09/08 Javascript
详解javascript事件绑定使用方法
2016/10/20 Javascript
详解nodejs 文本操作模块-fs模块(二)
2016/12/22 NodeJs
Bootstrap3 图片(响应式图片&amp;图片形状)
2017/01/04 Javascript
纯js的右下角弹窗实例
2017/03/12 Javascript
jQuery tip提示插件(实例分享)
2017/04/28 jQuery
JavaScript该如何学习 怎样轻松学习JavaScript
2017/06/12 Javascript
AngularJs每天学习之总体介绍
2017/08/07 Javascript
vue-resource拦截器设置头信息的实例
2017/10/27 Javascript
浅谈JS对象添加getter与setter的5种方法
2018/06/09 Javascript
微信小程序日历组件使用方法详解
2018/12/29 Javascript
JS中锚点链接点击平滑滚动并自由调整到顶部位置
2021/02/06 Javascript
Python中使用摄像头实现简单的延时摄影技术
2015/03/27 Python
Python3的urllib.parse常用函数小结(urlencode,quote,quote_plus,unquote,unquote_plus等)
2016/09/18 Python
python常见排序算法基础教程
2017/04/13 Python
利用python为运维人员写一个监控脚本
2018/03/25 Python
Python实现CNN的多通道输入实例
2020/01/17 Python
利用CSS3实现单选框动画特效示例代码
2016/09/26 HTML / CSS
HTML5重塑Web世界它将如何改变互联网
2012/12/17 HTML / CSS
《草虫的村落》教学反思
2014/02/16 职场文书
常务副总经理岗位职责
2014/04/12 职场文书
幼儿园中班下学期评语
2014/04/18 职场文书
党员对照检查材料思想汇报
2014/09/16 职场文书
2014年党员自我评议对照检查材料
2014/09/20 职场文书
个人纪律作风整改措施思想汇报
2014/10/12 职场文书
土地租赁协议书
2015/01/29 职场文书
2015年学校党建工作总结
2015/05/19 职场文书
Python上下文管理器Content Manager
2021/06/26 Python