标签: 延时函数

  • 定时器-延时函数

    setTimeout() / clearTimeout()

    语法:

    setTimeout(回调函数,延迟毫秒数)

    setTimeout 仅仅只执行一次,所以可以理解为就是把一段代码延迟执行, 平时省略window

    清除延时函数

    let timer = setTimeout(回调函数,延迟毫秒数) //把定时器的ID给变量timer
    clearTimeout(timer) //通过ID清除定时器
    

    需要注意的是setTimeout()setInterval()共用一个编号池,技术上,clearTimeout()和 clearInterval()可以互换。但是,为了避免混淆,不要混用取消定时函数。

    同一个对象上(一个window或者worker),setTimeout()或者setInterval()在后续的调用不会重用同一个定时器编号。但是不同的对象使用独立的编号池。

    window.setTimeout – Web API 接口参考 | MDN

    结合递归函数让setTimeout()实现setInterval()的效果

    let i= 0
    function test(){
      i++
      setTimeout(test,1000)  //注意:setTimeout内的函数不需要写括号
      console.log(i);
    }
    test()
    

    两种定时器对比

    • setInterval() 的特征是重复执行,首次执行会延时
    • setTimeout() 的特征是延时执行,只执行 1 次
    • setTimeout() 结合递归函数,能模拟 setInterval() 重复执行
    • clearTimeout() 清除由 setTimeout() 创建的定时任务

    拓展

    console.log(111)
    
    setTimeout(function () {
      console.log(222)
    	}, 0)
    
    console.log(333)
    
    //结果 111 333 222
    

    详见js执行机制