定时器

1. setTimeout() 用来指定某个函数或字符串在指定的毫秒数之后执行 只执行一次

   • clearTimeout() 清除定时器

   /*setTimeout() 有两个参数
   1.执行体 注意:函数传递参数可以把实参放在时间参数的后面(不兼容IE9及以下)
   2.时间 多久执行*/
   let a=0
   let fun =()=>{
      a++
      console.log(a)
      setTimeout(fun,1000)
   }
   setTimeout(fun,1000)
   
   //clearTimeout() //参数是定时器的名称
   let timer = 0
   let a = 0
   let fun=()=>{
      a++
      console.log(a)
      timer = setTimeout(fun,1000)
   }
   fun()
   
   document.onclick = ()=>{
      console.log("定时器停止了")
      clearTimeout(timer)
   }

2. setInterval() 用来指定某个函数或字符串在指定的毫秒数之后执行 无限循环

   • clearInterval() 清除定时器

   //传递参数是一样的结构
   let timer = setInterval(function(){
      console.log(1)
   },1000)
   document.onclick = ()=>{
      console.log("定时器停止了")
      clearInterval(timer)
   }

3. requestAnimationFrame() 浏览器专门为动画提供的API 浏览器会自动优化方法的调用 页面不是激活的状态下 动画暂停 有效节省CPU开销 用法与setTimeout相似 只是不需要设置时间间隔

   • cancelAnimationFrame()

   //复合动画帧的计时器,使得动画更流畅,也只是执行一次
   let timer = 0
   let a = 0
   function fun(){
      a++
      console.log(a)
      timer = requestAnimationFrame(fun)
   }
   fun()
   document.onclick=()=>{
      console.log("定时器停止了")
      cancelAnimationFrame(timer)
   }