JS--利用setTimeout模拟setInterval
setTimeout(fn, time),
超时调用,在时间大于等于 time 时调用;
setInterval(fn, time),
是间歇调用,每隔 time 调用一次。从载入后,每隔指定的时间就执行一次表达式,只要窗口不关闭或 clearInterval()
调用就会无限循环下去
虽然两者不一样,但是却可以相互模拟。具体使用那个,以具体的需求和场景具体分析,就像for循环可以模拟所有的循环一样(包括分支,以及do while
一样)。一般情况下 setTimeout()
用于延迟执行某方法或功能;setInterval()
则一般用于刷新表单,对于一些表单的假实时指定时间刷新同步
这种重复定时器的规则有两个问题:
某些间隔会被跳过
多个定时器的代码执行时间可能会比预期小。
为了避免setInterval()
的重复定时器的这两个缺点,可以使用模拟setInterval
/*** * @param {*} dom1 启动定时器的元素* @param {*} dom2 关闭定时器的元素* @param {*} fn 需要执行的定时器函数* @param {*} interval 定时器的时间间隔*/
function setTimeout_setInterval(dom1, dom2, fn, interval) {var timer = time;var flag = true;function time() {fn()setTimeout(time, interval);};dom1.onclick = function() {if (typeof time === "function") {time();} else {time = timer;time();}}dom2.onclick = function() {time = null;}
}
模拟 setTimeout() :用 setInterval() 模拟 setTimeout() 很简单,在 setInterval() 执行一次后,立刻关闭窗口(当然这是耍无赖)或者执行 clearInterval() 方法(这个靠谱点)。clearInterval() 需要在 setInterval()执行code方法内或其他地方执行,不能紧接着 setInterval() 后面执行,那样setInterval() 还没等到执行,就已经被干掉了
var intervalNum = 0, clearId = 0;
function testsetInterval(){var date = new Date();console.log(date.getSeconds());console.log("setInterval", intervalNum++);clearInterval(clearId); //也可以在此执行
}
function testFuntion() {clearId = setInterval(function () {testsetInterval(); //每隔4秒调用testsetInterval()// clearInterval(clearId); //可以在此执行},4000);
}
上面代码实现了递归调用,这样做的好处是:在前一个定时器代码执行完成之前,不会向队列插入新的定时代码,确保不会有任何的缺失间隔。而且,它保证在下一次定时器代码执行之前,至少要等待指定的时间间隔。
JS--利用setTimeout模拟setInterval相关推荐
- JS定时器setTimeout和setInterval介绍
JS定时器setTimeout和setInterval介绍 JavaScript 定时器,有时也称为"计时器",用来在经过指定的时间后执行某些任务.avaScript 中提供了两种 ...
- setTimeout模拟setInterval
setInterval存在的问题 首先明确,无论setTimeout还是setInterval,都是在指定时间,将回调函数推入任务队列,无法保证实际执行时间. 区别在于,setTimeout直 ...
- js中setTimeout的用法和JS计时器setTimeout与setInterval方法的区别和confirm方法
setTimeout()在js类中的使用方法 setTimeout (表达式,延时时间) setTimeout(表达式,交互时间) 延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTi ...
- 前端开发:JS中setTimeout和setInterval的对比使用
前言 在前端开发过程中,关于计时器的使用是非常常用的知识点,也是非常重要的,尤其是需要规定延迟多久之后再去执行某个操作.在JS的计时器使用中有setTimeout和setInterval,二者都是定时 ...
- 利用setTimeout实现setInterval
1.定时器的概念介绍 关于定时器要记住的最重要的事情是,指定的时间间隔表示何时将定时器的代码添加到队列,而不是何时实际执行代码 假设有这样一句代码 var btn = document.getElem ...
- js定时器setTimeout和setInterval用法及区别,清除定时器的使用
setTimeout和setInterval使用方法 定时器两个参数,第一个是执行代码,第二个是执行时间.执行时间自己随便设置,执行代码有以下几种方式传入: 1.匿名函数形式传入 setTimeout ...
- JS 中settimeout和setinterval函数的区别
2019独角兽企业重金招聘Python工程师标准>>> 首先settimeout一定时间之后执行表达式或程序,并只执行一次:setinterval是每间隔一定时间后开始执行表达式或程 ...
- JS中SetTimeOut和SetInterval方法的区别?
1.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭.由 ...
- 每日题(js):setTimeout与setInterval(深入理解)
题目:setInterval/setTimeout 详细理解 定时器:setTimeout setTimeout()方法设置一个定时器,该定时器在定时器到期后执行一个函数或指定的一段代码. var t ...
最新文章
- 框架警察 fxcop 的规则莫名其妙
- 用NiceTool在微信浏览器中下载APP
- Linux 中的零拷贝技术,第 2 部分
- 加载dict_Python的dict实现原理和Java的HashMap之间的区别
- spark用scala读取hive表数据(不同版本区别)
- Sublime 插件- px 转rem
- 秒杀场景_同步秒杀分析和实战_01
- Squid服务器配置
- ctf解题--算术题
- 尼日利亚4g频段_世界各国全球主要4g频段资料
- java星号心形代码_c语言实现星号爱心的代码
- 前端面试题整理(一)
- 讯为4412蜂鸣器驱动实现
- Espresso测试框架的使用
- 《期权、期货及其他衍生产品》读书笔记(第九章:价值调节量)
- 画色彩如何画出体积感
- 什么是IP Core?
- Android 5.1以上双卡指定sim卡拨打电话
- 深圳市七娘山登山攻略(深圳市第二峰) 2019.8.31
- 麻将胡牌算法 极速(速度接近理论极限)
热门文章
- [论文笔记]Age of Information Aware Radio Resource Management in Veh Net: A Proactive DRL Perspective
- ⑰霍兰德EI*如何选选专业?高考志愿填报选专业
- 图像缩放算法(中篇)
- SpringBoot配置过滤器和拦截器
- RK3188 5.1平台PCM2708 USB声卡调试
- 研究生招生信息网服务器异常,2012研究生网上报名常见问题汇总
- C语言如何输入带空格的字符串?
- Win 10 企业版发大招 招招吸引SMB用户
- 法线向量如何归一化(Normalize)
- ceph rgw lc工作流程