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 相关文章推荐
JqGrid web打印实现代码
May 31 Javascript
Javascript数组Array方法解读
Mar 13 Javascript
javascript类型系统——日期Date对象全面了解
Jul 13 Javascript
JavaScript中日常收集常见的10种错误(推荐)
Jan 08 Javascript
JS表单数据验证的正则表达式(常用)
Feb 18 Javascript
JS拉起或下载app的实现代码
Feb 22 Javascript
关于JavaScript中的this指向问题总结篇
Jul 23 Javascript
AngularJS中重新加载当前路由页面的方法
Mar 09 Javascript
浅析vue.js数组的变异方法
Jun 30 Javascript
vue自定义tap指令及tap事件的实现
Sep 18 Javascript
webpack4与babel配合使es6代码可运行于低版本浏览器的方法
Oct 12 Javascript
js实现图片上传即时显示效果
Sep 30 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
PL-880隐藏功能
2021/03/01 无线电
PHP管理内存函数 memory_get_usage()使用介绍
2012/09/23 PHP
完善CodeIgniter在IDE中代码提示功能的方法
2014/07/19 PHP
PHP 导出Excel示例分享
2014/08/18 PHP
用jquery实现自定义风格的滑动条实现代码
2011/04/26 Javascript
3款实用的在线JS代码工具(国外)
2012/03/15 Javascript
js 一个关于图片onload加载的事
2013/11/10 Javascript
纯js实现div内图片自适应大小(已测试,兼容火狐)
2014/06/16 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
基于jQuery实现的美观星级评论打分组件代码
2015/10/30 Javascript
酷炫jQuery全屏3D焦点图动画效果
2016/03/22 Javascript
jQuery fadeOut 异步实例代码详解
2016/08/18 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
2016/08/24 Javascript
JS简单实现无缝滚动效果实例
2016/08/24 Javascript
jQuery中Datatables增加跳转到指定页功能
2017/02/08 Javascript
AngularJS 购物车全选/取消全选功能的实现方法
2017/08/14 Javascript
javascript观察者模式实现自动刷新效果
2017/09/05 Javascript
JS返回顶部实例代码
2020/08/09 Javascript
详解webpack 打包文件体积过大解决方案(code splitting)
2018/04/10 Javascript
vuex 解决报错this.$store.commit is not a function的方法
2018/12/17 Javascript
微信公众平台 客服接口发消息的实现代码(Java接口开发)
2019/04/17 Javascript
vue抽出组件并传值实例
2020/07/31 Javascript
利用Celery实现Django博客PV统计功能详解
2017/05/08 Python
numpy.delete删除一列或多列的方法
2018/04/03 Python
PySide2出现“ImportError: DLL load failed: 找不到指定的模块”的问题及解决方法
2020/06/10 Python
HTML5 实战PHP之Web页面表单设计
2011/10/09 HTML / CSS
浅谈HTML5中dialog元素尝鲜
2018/10/15 HTML / CSS
Bandier官网:奢侈、时尚前卫的健身服装首选目的地
2020/07/05 全球购物
财务会计专业毕业生自荐信
2013/10/19 职场文书
师范学院毕业生求职信范文
2013/12/26 职场文书
公司司机岗位职责
2014/02/07 职场文书
2014年大学生村官工作总结
2014/11/19 职场文书
个人工作违纪检讨书
2015/05/05 职场文书
无房证明样本
2015/06/17 职场文书
医护人员继续教育学习心得体会
2016/01/19 职场文书
IIS服务器中设置HTTP重定向访问HTTPS
2022/04/29 Servers