setTimeout不可靠的修正办法及clearTimeout
javascript里的这两个定时器函数,大家一定耳熟能详:
setTimeout("函数()",毫秒)就是开启一个计时器,指定毫秒后执行该函数一次。
有关定时器,javascript还有另一个类似的函数,setInterval("函数()",毫秒)。不同的是,setInterval不是指定时间后执行一次该函数,而是每隔指定时间执行该函数,连续不断,直到clearInterval()。
问题是,在实际使用过程中,发现javascript的定时器很不靠谱。说好的多少多少时间后执行,但给人的感觉是忽快忽慢。明明指定3秒后执行,竟然5、6秒后才触发,或者不到1秒就触发了!
查阅资料,说是javascript为单线程,setTimeout之后,就注册了一个事件,进入排队,有空才执行,所以就慢了。大意如此。但快的情况呢?好像没说。
javascript引擎只有一个线程,迫使异步事件只能加入队列去等待执行。
在执行异步代码的时候,setTimeout 和setInterval 是有着本质区别的。
如果计时器被正在执行的代码阻塞了,它将会进入队列的尾部去等待执行直到下一次可能执行的时间出现(可能超过设定的延时时间)。
如果interval回调函数执行需要花很长时间的话(比指定的延时长),interval有可能没有延迟背靠背地执行。
上述这一切对于理解js引擎是如果工作的无疑是很重要的知识,尤其是大量的典型的异步事件发生时,对于构建一个高效的应用代码片段来说是一个非常有利的基础。
那么能不能修正呢?受网上文章启发,可以采用读取时间来应对:
setTimeout的时候,记录当前时间戳
函数触发时,将时间戳与当前时间比较,看是否已经经过指定的毫秒数
时间未够,则继续setTimeout,步长可改为1秒
否则执行
<html>
<head>
</head>
<body>
<input type="button" value="开启" onclick="start()" />
</body>
</html>
<script type="text/javascript">
var t;
var marktime = 0;
var offset = 3000;
function start(){
marktime = new Date().getTime();//1970年1月1日以来的毫秒数
t = setTimeout("hi()",offset);//3000毫秒后触发
}
function hi(){
if (new Date().getTime() - marktime < offset) {//时间未够
t = setTimeout("hi()",1000);//一秒后再来看看
return;
}
alert("Hello World!");
}
</script>
以上方法可应对比指定时间快的情况。
至于clearTimeout,经测试
var t = setTimeout("hi()",1000);
clearTimeout();//不起任何作用
clearTimeout(t);//将计时器t消除
setTimeout的作用,就是注册一个计时器,计时器之间各自独立,不会覆盖和干扰;注册多少遍,就有多少个,执行指定函数后自己释放。所以每次setTimeout,应该获取返回值,以便操控:
var t = setTimeout("hi()",1000);
clearTimeout(t);//将计时器t消除
setTimeout不可靠的修正办法及clearTimeout的更多相关文章
- js中如果遇到低版本安卓设备调用setTimeout不生效解决办法
工作中会遇到低版本安卓设备调用setTimeout不生效,既不会报错,里面的函数也不会执行,这里po一个解决办法,如果不执行则执行安卓自己封装的原生的setTimeout方法:sdk.setTimeo ...
- JS之setTimeOut与clearTimeOut
小练习1:针对HTML,分别使用 setTimeout 和 setInterval 实现以下功能: 点击按钮时,开始改变 fade-obj 的透明度,开始一个淡出(逐渐消失)动画,直到透明度为0 在动 ...
- SetTimeOut jquery的作用
1. SetTimeOut() 1.1 SetTimeOut()语法例子 1.2 用SetTimeOut()执行Function 1.3 SetTimeOut()语法例子 1.4 设定条件使SetTi ...
- js中的SetTimeOut
1. SetTimeOut() 1.1 SetTimeOut()语法例子 1.2 用SetTimeOut()执行Function ...
- JS中setTimeout()的用法详解
1. SetTimeOut() 1.1 SetTimeOut()语法例子 1.2 用SetTimeOut()执行Function 1.3 SetTimeOut()语法例子 1.4 设定条件使SetTi ...
- Js setTimeout 用法
setTimeout( ) 是属于 window 的 method, 但我们都是略去 window 这顶层物件名称, 这是用来设定一个时间, 时间到了, 就会执行一个指定的 method. setTi ...
- JS动画三剑客——setTimeout、setInterval、requestAnimationFrame
一.前言 前端实现动画效果主要有以下几种方法:CSS3中的transition 和 animation ,Javascript 中可以通过定时器 setTimeout.setinterval,HTML ...
- 深入理解定时器系列第一篇——理解setTimeout和setInterval
× 目录 [1]setTimeout [2]setInterval [3]运行机制[4]作用[5]应用 前面的话 很长时间以来,定时器一直是javascript动画的核心技术.但是,关于定时器,人们通 ...
- setTimeout 和 setInterval 的区别
setTimeout (表达式,延时时间)setInterval(表达式,交互时间)延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTimeout 在执行时,是在载入后延迟指定时间 ...
随机推荐
- kvm中内存过载使用
与CPU过载使用类似,在KVM中内存也是允许过载使用(over commit)的,KVM能够让分配给客户机的内存总数大于实际可用的物理内存总数. 由于客户机操作系统及其上的应用程序并非一直100%地利 ...
- LeetCode01--两数之和
''' 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的 两个 整数. 你可以假设每种输入只会对应一个答案.但是,你不能重复利用这个数组中同样的元素. 示例: 给 ...
- 大数据学习——点击流日志每天都10T,在业务应用服务器上,需要准实时上传至(Hadoop HDFS)上
点击流日志每天都10T,在业务应用服务器上,需要准实时上传至(Hadoop HDFS)上 1需求说明 点击流日志每天都10T,在业务应用服务器上,需要准实时上传至(Hadoop HDFS)上 2需求分 ...
- BestCoder Round #90 A+B题解!
BestCoder Round #90 A Kblack loves flag 题意有点迷不造思路很简单但不造怎么求随机数,纠结了一会后直接粘上题目所给的代码稍加修改A了. const int _K ...
- bzoj3572[Hnoi2014] 世界树 虚树+dp+倍增
[Hnoi2014]世界树 Time Limit: 20 Sec Memory Limit: 512 MBSubmit: 1921 Solved: 1019[Submit][Status][Dis ...
- PHP建立和删除目录
<?php/*linux中的文件权限filedir 用户 组 其它 rwx rwx rwx 读写执行 6 4 6 读写 读 读写 7 7 7 rw_ r__ rw_ r__ _w_ ___ r ...
- 蓝桥杯 算法训练 最短路 [ 最短路 bellman ]
传送门 算法训练 最短路 时间限制:1.0s 内存限制:256.0MB 锦囊1 锦囊2 锦囊3 问题描述 给定一个n个顶点,m条边的有向图(其中某些边权可能为负,但保证 ...
- Android资源目录结构
资源目录结构 res为资源目录,主要以xml语法编写静态的资源. 资源的命名标准:小写字母和数字,且以小写字母开头. 资源的生成,为了和java语法沟通,资源文件会自动的生成在[gen]目录的R.ja ...
- POJ3177,/3352.求最少添加多少边使无向图边双连通
俩个题一样.tarjan算法应用,开始求桥,WA,同一个边双连通分量中low值未必都相同,不能用此来缩点.后来用并查集来判断,若不是桥,则在一个双连通分量中,并之,后边再查,将同一个双连通分量中的点通 ...
- python学习之-- socketserver模块
socketserver 模块简化了网络服务器的编写,主要实现并发的处理. 主要有4个类:这4个类是同步进行处理的,另外通过ForkingMixIn和ThreadingMixIn类来支持异步.sock ...