js:计时器setInterval\setTimeout

在开发中,相信大家都或多或少的遇到使用计时器功能,这次我就掉坑里了,花了一点时间才爬出来,这里给小伙伴们做了一个总结,希望可以帮助到你们。

计时器类型

一次性计时器:仅在指定的延迟时间之后触发一次。
间隔性触发计时器:每隔一定的时间间隔就触发一次。

计时器语法

1、定时器setInterval()

在执行时,从载入页面后每隔指定的时间执行代码。

# 注释:交互时间,以毫秒计(1s=1000ms)
setInterval(() => { 需要执行代码 }, 交互时间)
# 取消由 setInterval() 设置的交互时间。
clearInterval() 

2、延迟器

在载入后延迟指定时间后,去执行一次表达式,仅执行一次。

setTimeout(代码,延迟时间)
# setTimeout()和clearTimeout()一起使用,停止计时器。
clearTimeout()

计时器关闭失效问题

1、直接使用计时器语法创建和销毁,销毁失败,这里有可能是环境问题,推荐window挂载:

const timer= window.setInterval(() => {
    // 执行代码
}, 5000)
# 某个节点销毁
window.clearInterval(timer)

2、自己创建了多个计时器,关闭指令执行的定时器找不到源头问题。

const timer= null 
if (!timer) {
  timer= setInterval(() => {
     // 执行代码
  }, 5000)
}
# 某个节点销毁
if (!timer) {
  clearInterval(timer)
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容