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 相关文章推荐
js跑步算法的实现代码
Dec 04 Javascript
jquery带翻页动画的电子杂志代码分享
Aug 21 Javascript
轻松掌握JavaScript装饰者模式
Aug 27 Javascript
jQuery Position方法使用和兼容性
Aug 23 jQuery
浅谈react 同构之样式直出
Nov 07 Javascript
详解webpack编译多页面vue项目的配置问题
Dec 11 Javascript
完美解决linux下node.js全局模块找不到的情况
May 16 Javascript
微信小程序实现多选功能
Nov 04 Javascript
JavaScript类的继承操作实例总结
Dec 20 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
Apr 26 Javascript
Angular中innerHTML标签的样式不起作用的原因解析
Jun 18 Javascript
JavaScript实现放大镜效果代码示例
Apr 29 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
php更新mysql后获取影响的行数发生异常解决方法
2013/03/28 PHP
ThinkPHP模版中导入CSS和JS文件的方法
2014/11/29 PHP
理解PHP中的Session及对Session有效期的控制
2016/01/08 PHP
php查询操作实现投票功能
2016/05/09 PHP
php面向对象的用户登录身份验证
2017/06/08 PHP
北京奥运官方网站幻灯切换效果flash版打包下载
2008/01/30 Javascript
JavaScript入门教程(10) 认识其他对象
2009/01/31 Javascript
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
使用jQuery内容过滤选择器选择元素实例讲解
2013/04/18 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
Jquery简单分页实现方法
2015/07/24 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
2016/01/18 Javascript
jquery动态创建div与input的实例代码
2016/10/12 Javascript
JavaScript实现数组降维详解
2017/01/05 Javascript
Vue键盘事件用法总结
2017/04/18 Javascript
原生JS实现层叠轮播图
2017/05/17 Javascript
vue语法之拼接字符串的示例代码
2017/10/25 Javascript
Mac中安装nvm的教程分享
2017/12/11 Javascript
javaScript实现游戏倒计时功能
2018/11/17 Javascript
JavaScript中filter的用法实例分析
2019/02/27 Javascript
记录一次完整的react hooks实践
2019/03/11 Javascript
js图片查看器插件用法示例
2019/06/22 Javascript
Vue实现剪贴板复制功能
2019/12/31 Javascript
vue axios封装httpjs,接口公用配置拦截操作
2020/08/11 Javascript
[00:57]深扒TI7聊天轮盘语音出处5
2017/05/11 DOTA
python构建自定义回调函数详解
2017/06/20 Python
Django使用paginator插件实现翻页功能的实例
2018/10/24 Python
详解pandas使用drop_duplicates去除DataFrame重复项参数
2019/08/01 Python
在pycharm中配置Anaconda以及pip源配置详解
2019/09/09 Python
wxPython窗体拆分布局基础组件
2019/11/19 Python
解决margin 外边距合并问题
2019/07/03 HTML / CSS
俄罗斯最大的香水和化妆品网上商店:Randewoo
2020/11/05 全球购物
2014基建处领导班子“四风”对照检查材料思想汇报
2014/10/04 职场文书
单位婚育证明范本
2014/11/21 职场文书
幼儿园安全教育月活动总结
2015/05/08 职场文书
高中班主任心得体会
2016/01/07 职场文书