setInterval概念

实现定时调用函数，可按照指定的周期来调用函数或计算表达式；setInterval会一直不断地调用函数，直到clearInterval被调用或者窗口被关闭。

setTimeout概念

用于在指定时间后调用函数或计算表达式；只会执行一次；

setTimeout实现setInterval

function mySetTimeout(func,delay){
  //声明timer，用于后面清除定时器
  let timer = null
  const interval = () =>{
    //执行对应传入函数
    func()
    //用timer接收setTimeout返回的定时器编号
    //setTimeout接收interval和delay，等待delay结束后，再次执行setTimeout
    timer = setTimeout(interval,delay)
  }
  //第一次调用setTimeout，调用interval，时延为delay
  setTimeout(interval,delay)
  //返回一个cancel方法取消调用
  return {
    cancel: ()=>{
      //清除timer编号的定时器
      clearTimeout(timer)
    }
  }
}

// 测试
//传进一个console.log的函数，解构出cancel方法
const { cancel } = mySetTimeout(() => console.log(888),1000)
setTimeout(()=>{
  cancel()
},4000)

setInterval的缺点

1、无视代码错误

setInterval执行过程中会无视自己调用的代码，会持续不断地调用改代码；

2、无视网络延迟

无视对网络请求的响应是否完成，会不断发送请求；

3、不保证执行

到了时间间隔，如果setInterval需要调用的函数需要花费时间较长，可能就会被直接忽略。

扩展

用setInterval实现setTimeout

function mySetInterval(func,delay){
  //timer用来接收setInterval返回的编号，用于后面清除setInterval
  //setInterval会一直执行，但是在setInterval里面执行clearInterval()将会被清除
  const timer = setInterval(()=>{
    //执行传入函数
    func()
    //清除该次setInterval
    clearInterval(timer)
  },delay)
}