浅谈JavaScript中setInterval和setTimeout的使用问题


Posted in Javascript onAugust 01, 2015

说到setInterval,就不得不提到setTimeout,二者都是用于定时执行某函数,区别在于setTimeout 只执行一次,而setInterval可以一直连续不断执行下去,典型用法如下:

function do_sth() { console.log('Hello...'); }
setTimeout(do_sth, 2500);  // 2.5 秒后,执行 do_sth 函数(只执行一次)
setInterval(do_sth, 3500); // 3.5 秒后,执行 do_sth 函数(每隔 3.5 秒执行一次,一直执行下去)

表面看上去,二者各有各的用途,没什么问题。但是如果setInterval所执行的函数是比较耗时的动作,setInterval仍然会按照原计划安排调用那个函数,而不考虑之前的任何阻塞,这样随着时间的推移,队列中等待执行的函数就会越来越多。而对于此问题解决方案仍然是采用递归调用setTimeout 的方法,如:

function do_sth() {
 console.log('Hello...');  // 即使这里执行比较耗时的动作也没问题,
                  // 等这里执行完了才会再去调用 setTimeout

 setTimeout(do_sth, 2500); // 安排后续执行
}

do_sth();             // 初次执行

这种递归调用的方式,既可以达到循环执行某函数的目的,有可以防止后续任务不断堆积。

如果你觉得这种方式有点罗嗦,还可以再写得精炼一些:

(function() {
 console.log('Hello...');  // do something here
 setTimeout(arguments.callee, 2500);
})();

说是这么说,但是如果定时执行的任务开销很少,setInterval一般是没什么问题的,但是如果任务开销比较大,请务必使用setTimeout。

Javascript 相关文章推荐
js中设置元素class的三种方法小结
Aug 28 Javascript
jquery动态增加text元素以及删除文本内容实例代码
Jul 01 Javascript
JQuery1.8 判断元素是否绑定事件的方法
Jul 10 Javascript
jquery淡入淡出效果简单实例
Jan 14 Javascript
基于jquery编写的放大镜插件
Mar 23 Javascript
关于JavaScript和jQuery的类型判断详解
Oct 08 Javascript
使用Angular.js开发的注意事项
Oct 19 Javascript
JS数字千分位格式化实现方法总结
Dec 16 Javascript
vuejs指令详解
Feb 07 Javascript
Bootstrap Table 在指定列中添加下拉框控件并获取所选值
Jul 31 Javascript
在 Linux/Unix 中不重启 Vim 而重新加载 .vimrc 文件的流程
Mar 21 Javascript
Node 搭建一个静态资源服务器的实现
May 20 Javascript
JavaScript图片轮播代码分享
Jul 31 #Javascript
简单实现异步编程promise模式
Jul 31 #Javascript
JavaScript数据类型判定的总结笔记
Jul 31 #Javascript
jquery代码实现多选、不同分享功能
Jul 31 #Javascript
Jquery实现瀑布流布局(备有详细注释)
Jul 31 #Javascript
jquery实现仿JqueryUi可拖动的DIV实例
Jul 31 #Javascript
jQuery+css3实现文字跟随鼠标的上下抖动
Jul 31 #Javascript
You might like
咖啡机如何保养和日常清洁?
2021/03/03 冲泡冲煮
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
php cli模式下获取参数的方法
2017/05/05 PHP
Easy.Ajax 部分源代码 支持文件上传功能, 兼容所有主流浏览器
2011/02/24 Javascript
asp.net 30分钟掌握无刷新 Repeater
2011/09/16 Javascript
javascript学习笔记(六) Date 日期类型
2012/06/19 Javascript
利用JS来控制键盘的上下左右键(示例代码)
2013/12/14 Javascript
JS创建自定义表格具体实现
2014/02/11 Javascript
JavaScript中数组成员的添加、删除介绍
2014/12/30 Javascript
常见JS验证脚本汇总
2015/12/01 Javascript
JavaScript实现的DOM树遍历方法详解【二叉DOM树、多叉DOM树】
2018/05/07 Javascript
一个Vue页面的内存泄露分析详解
2018/06/25 Javascript
Fetch超时设置与终止请求详解
2019/05/18 Javascript
vue+element UI实现树形表格
2020/12/29 Vue.js
[02:48]DOTA2英雄基础教程 拉席克
2013/12/12 DOTA
[02:05]2014DOTA2西雅图邀请赛 老队长全明星大猜想谁不服就按进显示器
2014/07/08 DOTA
[26:21]浴火之凤-TI4世界冠军Newbee战队纪录片
2014/08/07 DOTA
[01:41]DOTA2 2015国际邀请赛中国区预选赛第三日战报
2015/05/28 DOTA
简单掌握Python中glob模块查找文件路径的用法
2016/07/05 Python
numpy使用技巧之数组过滤实例代码
2018/02/03 Python
python spyder中读取txt为图片的方法
2018/04/27 Python
浅谈python中np.array的shape( ,)与( ,1)的区别
2018/06/04 Python
Python编写通讯录通过数据库存储实现模糊查询功能
2019/07/18 Python
Python统计分析模块statistics用法示例
2019/09/06 Python
简单了解Django ORM常用字段类型及参数配置
2020/01/07 Python
Python datetime 格式化 明天,昨天实例
2020/03/02 Python
python 使用cx-freeze打包程序的实现
2020/03/14 Python
django使用channels实现通信的示例
2020/10/19 Python
益模软件Java笔试题
2012/03/27 面试题
政风行风评议心得体会
2014/10/21 职场文书
机关作风建设自查报告及整改措施
2014/10/21 职场文书
市场营销计划书范文
2015/01/16 职场文书
餐厅营销的秘密:为什么老顾客会流水?
2019/08/08 职场文书
浅谈mysql返回Boolean类型的几种情况
2021/06/04 MySQL
浅谈自定义校验注解ConstraintValidator
2021/06/30 Java/Android
win11开机发生死循环重启怎么办?win11开机发生死循环重启解决方法
2022/08/05 数码科技