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 相关文章推荐
AJAX 网页保留浏览器前进后退等功能
Feb 12 Javascript
再谈javascript图片预加载技术(详细演示)
Mar 12 Javascript
Javascript闭包用法实例分析
Jan 23 Javascript
JavaScript中setFullYear()方法的使用详解
Jun 11 Javascript
AngularJS中的$watch(),$digest()和$apply()区分
Apr 04 Javascript
Express URL跳转(重定向)的实现方法
Apr 07 Javascript
基于bootstrap实现bootstrap中文网巨幕效果
May 02 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
js动态引入的四种方法
May 05 Javascript
解决Js先触发失去焦点事件再执行点击事件的问题
Aug 30 Javascript
原生JS与JQ获取元素的区别详解
Feb 13 Javascript
针对Vue路由history模式下Nginx后台配置操作
Oct 22 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 木马攻击防御技巧
2009/06/13 PHP
php实现用户在线时间统计详解
2011/10/08 PHP
PHP实现的简单mock json脚本分享
2015/02/10 PHP
新浪微博OAuth认证和储存的主要过程详解
2015/03/27 PHP
php微信高级接口群发 多客服
2016/06/23 PHP
PHP中file_put_contents追加和换行的实现方法
2017/04/01 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
php中各种定义变量的方法小结
2017/10/18 PHP
Laravel 框架路由原理与路由访问实例分析
2020/04/14 PHP
Jquery插件分享之气泡形提示控件grumble.js
2014/05/20 Javascript
关于javaScript注册click事件传递参数的不成功问题
2014/07/18 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
2014/09/25 Javascript
理解jQuery stop()方法
2014/11/21 Javascript
jQuery实现单击和鼠标感应事件
2015/02/01 Javascript
Javascript实现字数统计
2015/07/03 Javascript
基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标
2016/01/22 Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
2016/05/31 Javascript
JS去除空格和换行的正则表达式(推荐)
2016/06/14 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
JavaScript数组方法的错误使用例子
2018/09/13 Javascript
浅谈vux之x-input使用以及源码解读
2018/11/04 Javascript
深入理解Node内建模块和对象
2019/03/12 Javascript
jQuery实现全选、反选和不选功能的方法详解
2019/12/04 jQuery
openlayers4.6.5实现距离量测和面积量测
2020/09/25 Javascript
vue使用video插件vue-video-player详解
2020/10/23 Javascript
[03:52]显微镜下的DOTA2第三期——英雄在无聊的时候干什么
2014/06/20 DOTA
[29:59]完美世界DOTA2联赛PWL S3 Forest vs access 第二场 12.11
2020/12/13 DOTA
Python开发的单词频率统计工具wordsworth使用方法
2014/06/25 Python
python实现的登录和操作开心网脚本分享
2014/07/09 Python
Python松散正则表达式用法分析
2016/04/29 Python
PyTorch加载自己的数据集实例详解
2020/03/18 Python
美国最大的网络男装服装品牌:Bonobos
2017/05/25 全球购物
优秀小学生家长评语
2014/01/30 职场文书
学校教研活动总结
2014/07/02 职场文书
vscode中使用npm安装babel的方法
2021/08/02 Javascript
“鬼灭之刃”热度不减,其成功背后的原因是什么?
2022/03/22 日漫