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 动态参数判空操作
Dec 22 Javascript
jQuery 性能优化指南(2)
May 21 Javascript
node.js回调函数之阻塞调用与非阻塞调用
Nov 13 Javascript
基于Bootstrap仿淘宝分页控件实现代码
Nov 07 Javascript
@ResponseBody 和 @RequestBody 注解的区别
Mar 08 Javascript
通过学习bootstrop导航条学会修改bootstrop颜色基调
Jun 11 Javascript
简单谈谈axios中的get,post方法
Jun 25 Javascript
seajs中模块依赖的加载处理实例分析
Oct 10 Javascript
JavaScript中BOM对象原理与用法分析
Jul 09 Javascript
vue cli安装使用less的教程详解
Jul 12 Javascript
JavaScript实现拖拽和缩放效果
Aug 24 Javascript
js中实现继承的五种方法
Jan 25 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
php2html php生成静态页函数
2008/12/08 PHP
PHP中error_reporting()函数的用法(修改PHP屏蔽错误)
2011/07/01 PHP
PHP采用get获取url汉字出现乱码的解决方法
2014/11/13 PHP
Windows下Apache + PHP SESSION丢失的解决过程全纪录
2015/04/07 PHP
PHP使用pear自带的mail类库发邮件的方法
2015/07/08 PHP
firefox浏览器下javascript 拖动层效果与原理分析代码
2007/12/04 Javascript
javascript中的throttle和debounce浅析
2014/06/06 Javascript
Javascript实现的Map集合工具类完整实例
2015/07/31 Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
2015/10/25 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
2016/01/27 Javascript
关于Bootstrap弹出框无法调用问题的解决办法
2016/03/10 Javascript
js HTML5上传示例代码完整版
2016/10/10 Javascript
js CSS3实现卡牌旋转切换效果
2017/07/04 Javascript
js实现canvas图片与img图片的相互转换的示例
2017/08/31 Javascript
webpack引入eslint配置详解
2018/01/22 Javascript
在vue-cli搭建的项目中增加后台mock接口的方法
2018/04/26 Javascript
使用Vue-cli 3.0搭建Vue项目的方法
2018/06/07 Javascript
JavaScript实现秒杀时钟倒计时
2019/09/29 Javascript
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
2019/11/18 jQuery
基于node+websocket+html实现腾讯课堂聊天室聊天功能
2020/03/04 Javascript
[02:31]2014DOTA2国际邀请赛2009专访:干爹表现出乎意料 看好DK杀回决赛
2014/07/20 DOTA
[43:47]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#2 MVP.Phx VS Fnatic第一局
2016/03/05 DOTA
利用Python的Django框架中的ORM建立查询API
2015/04/20 Python
Python中用于计算对数的log()方法
2015/05/15 Python
python运行其他程序的实现方法
2017/07/14 Python
linux安装Python3.4.2的操作方法
2018/09/28 Python
tensorflow获取预训练模型某层参数并赋值到当前网络指定层方式
2020/01/24 Python
Python random模块制作简易的四位数验证码
2020/02/01 Python
Python实现封装打包自己写的代码,被python import
2020/07/12 Python
简单几步用纯CSS3实现3D翻转效果
2019/01/17 HTML / CSS
澳大利亚Mocha官方网站:包、钱包、珠宝和配饰
2019/07/18 全球购物
.NET初级开发工程师面试题
2014/04/18 面试题
2015年语言文字工作总结
2015/07/23 职场文书
获奖感言一句话
2015/07/31 职场文书
MySQL注入基础练习
2021/05/30 MySQL
HTML CSS 一个标签实现带动画的抖音LOGO
2022/04/26 HTML / CSS