定时器
反复性定时器
定时器函数:间歇性函数,反复性定时器,可以让代码反复执行
声明反复性定时器
语法:windows.setInterval(函数,时间)
执行:每隔一段时间自动调用一次函数
代码演示:
function getUp() {
console.log("起床啦");
}
setInterval(getUp, 3000);
清除反复性定时器
语法:clearInterval(定时器标识)
代码演示:
let timer = setInterval(() => {
console.log("嘻嘻嘻嘻");
// 执行一次定时器后清除
clearInterval(timer);
}, 1000);
延迟性定时器
延迟函数:又称一次性定时器,延迟性定时器,可以让一段代码延后执行
声明延迟性定时器
语法:window.setTimeout(函数,时间)
执行:会延迟一段时间,再执行代码,而且代码只会执行一次
代码演示:
function aaa() {
console.log("哈哈哈哈哈");
}
setTimeout(aaa, 1000);
清除延迟性定时器
语法:clearTimeout(定时器标识)
结合使用
我们通常将延迟性函数与递归函数一起使用,来实现反复性定时器的功能。同时这种方法也可以解决反复性函数会延迟一秒执行的bug,因为函数会在调用前执行一次。
代码演示:
//延迟函数配合递归函数实现反复性定时器用例
let timer
function fn(){
console.log('延迟性定时器实现的反复性定时器')
timer=setTimeout(fn,1000)
}
fn()
注意事项
- 定时器函数的时间单位为毫秒
- 清除定时器时必须要有定时器标识,标识会在定时器创建时自动返回。因此我们在创建定时器时,会声明一个变量用来存储定时器标识,方便我们在清除定时器时使用
- 定时器括号中的函数相当于回调函数,使用时无需给函数加括号。因为饿加括号相当于调用函数,函数会不定定时器直接执行