精解window.setTimeout()&window.setInterval()使用方式与参数传递问题!


Posted in Javascript onNovember 23, 2007

在使用JScript的时候,我们有时需要间隔的执行一个方法,比如用来产生网页UI动画特效啥的。这是我们常常会使用方法setInterval或setTimeout,但是由于这两个方法是由脚本宿主模拟出来的Timer线程,在通过其调用我们的方法是不能为其传递参数。

    我们常用的使用场景是: 

window.setTimeout("delayRun()", n);  
window.setInterval("intervalRun()", n);  
window.setTimeout(delayRun, n);  
window.setInterval(intervalRun, n); 

    显然强行代参数的调用: window.setTimeout("delayRun(param)", n); 
window.setInterval("intervalRun(param)", n);  
window.setTimeout(delayRun(param), n);  
window.setInterval(intervalRun(param), n); 

    都是错误的,因为string literals形式的方法调用,param必须是全局变量(即window对象上的变量)才行;而function pointer形式的调用,完全错误了,这是把函数的返回值当成了setTimeout/setInterval函数的参数了,完全不是我们所望的事情。

    解决这个问题的办法可以使用匿名函数包装的方式,在以下scenario中我们这么做: 

function foo()  
{  
    var param = 100;  
    window.setInterval(function()  
    {  
        intervalRun(param);  
    }, 888);  
}  function interalRun(times)  
{  
    // todo: depend on times parameter  
} 
    这样一来,就可以不再依赖于全局变量向delayRun/intervalRun函数中传递参数,毕竟当页面中的全局变量多了以后,会给脚本的开发、调试和管理等带来极大的puzzle。
Javascript 相关文章推荐
js中获取事件对象的方法小结
Mar 13 Javascript
jquery jqPlot API 中文使用教程(非常强大的图表工具)
Aug 15 Javascript
js导航菜单(自写)简单大方
Mar 28 Javascript
js继承call()和apply()方法总结
Dec 08 Javascript
jQuery中removeData()方法用法实例
Dec 27 Javascript
js实现横向百叶窗效果网页切换动画效果的方法
Mar 02 Javascript
JS 作用域与作用域链详解
Apr 07 Javascript
JavaScript 最佳实践:帮你提升代码质量
Dec 03 Javascript
JavaScript实现百度搜索框效果
Mar 26 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
May 27 Javascript
Vue中nprogress页面加载进度条的方法实现
Nov 13 Javascript
JavaScript 防盗链的原理以及破解方法
Dec 29 Javascript
document.designMode的功能与使用方法介绍
Nov 22 #Javascript
Flash+XML滚动新闻代码 无图片 附源码下载
Nov 22 #Javascript
摘自百度的图片轮换效果代码
Nov 19 #Javascript
window.open被浏览器拦截后的自定义提示效果代码
Nov 19 #Javascript
比较简单实用的使用正则三种版本的js去空格处理方法
Nov 18 #Javascript
利用ASP发送和接收XML数据的处理方法与代码
Nov 13 #Javascript
javascript实现二分查找法实现代码
Nov 12 #Javascript
You might like
杏林同学录(四)
2006/10/09 PHP
discuz程序的PHP加密函数原理分析
2011/08/05 PHP
ThinkPHP模板IF标签用法详解
2014/07/01 PHP
PHP5.5迭代生成器用法实例详解
2016/03/16 PHP
php使用imagecopymerge()函数创建半透明水印
2018/01/25 PHP
比较详细的关于javascript中void(0)的具体含义解释
2007/08/02 Javascript
使用jquery实现div的tab切换实例代码
2013/05/27 Javascript
javascript页面渲染速度测试脚本分享
2014/04/15 Javascript
JavaScript中三种异步上传文件方式
2016/03/06 Javascript
js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法
2016/11/09 Javascript
Vue方法与事件处理器详解
2016/12/01 Javascript
详解VueJs前后端分离跨域问题
2017/05/24 Javascript
jQuery中元素选择器(element)简单用法示例
2018/05/14 jQuery
vue.draggable实现表格拖拽排序效果
2018/12/01 Javascript
[00:52]DOTA2国际邀请赛
2020/02/21 DOTA
Python  连接字符串(join %)
2008/09/06 Python
python创建只读属性对象的方法(ReadOnlyObject)
2013/02/10 Python
理解Python中的With语句
2016/03/18 Python
python实现mysql的读写分离及负载均衡
2018/02/04 Python
Python爬虫小技巧之伪造随机的User-Agent
2018/09/13 Python
简单了解Pandas缺失值处理方法
2019/11/16 Python
python3.4中清屏的处理方法
2020/07/06 Python
python 将Excel转Word的示例
2021/03/02 Python
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
利用html5 canvas破解简单验证码及getImageData接口应用
2013/01/25 HTML / CSS
HTML5 LocalStorage 本地存储刷新值还在
2017/03/10 HTML / CSS
Html5调用手机摄像头并实现人脸识别的实现
2018/12/21 HTML / CSS
美国网上鞋子零售商:Dr. Scholl’s Shoes
2017/11/17 全球购物
Hawes & Curtis官网:英国经典品牌
2019/07/27 全球购物
婚礼主持结束词
2014/03/13 职场文书
银行求职信范文怎么写
2015/03/20 职场文书
2016年十一促销广告语
2016/01/28 职场文书
学校教代会开幕词
2016/03/04 职场文书
mysql部分操作
2021/04/05 MySQL
Python 解决空列表.append() 输出为None的问题
2021/05/23 Python
vue postcss-px2rem 自适应布局
2022/05/15 Vue.js