定时器和延时器
2022年11月4日
定时器和延时器
定时器
setInterval()函数可以重复调用一个函数,在每次调用之间具有固定的时间间隔
setInterval(function() {
//这个函数将自动被以固定间隔时间调用
},2000);
setInterval()函数可以接收第3、4.....个参数,它们将按顺序传入函数
setInterval(function(a,b) {
//形参a的值为88,形参b的值为66
},2000,88,66);
具名函数也可以传入setInterval
var a = 0;
function fun(){
console.log(++a);
}
setInterval(fun,1000);
清楚定时器
clearInterval()函数可以清除一个定时器
// 设置定时器,并且用timer变量接收这个定时器
var timer = setInterval(function() {
},2000);
// 点击按钮时,清楚定时器
oBtn.onclick = function() {
clearInterval(timer);
}
延时器
setTimeout()函数可以设置一个延时器,当指定时间到了之后,会执行函数一次,不再重复执行
setTimeout(function() {
//这个函数回在2秒后执行一次
},2000);
clearTimeout()函数可以清除延时器,和clearInterval()非常类似
异步
setInterval()和setTimeout()是两个异步语句
异步 (asynchronous) : 不会阻塞CPU继续执行其他语句当异步完成时,会执行“回调函数(callback)
函数节流
函数节流:一个函数执行一次后,只有大于设定的执行周期后才允许执行第二次
函数节流非常容易实现,只需要借助setTimeout()延时器
var lock = true;
function 需要节流的函数() {
//如果锁时关闭状态,则不执行
if(!lock) return;
// 关锁
lock = false;
//指定毫秒数后将锁打开
setTimeout(function() {
lock = true;
},2000);
}