zoukankan      html  css  js  c++  java
  • 关于setInterval的坑

    一道面试题:
    “setInterval和setTimeout有什么区别”

    “如果setInterval计时器的回调函数执行完需要5秒,而计时器时间间隔为3秒,那会发生什么?”

    验证代码

    让程序滞留固定时间的方法如下:

    function sleep(time) {
      let startTime = window.performance.now();
      while (window.performance.now() - startTime < time) {}
    }
    

    运行代码如下:

    let count = 1;
    let getTime = window.performance;
    let startTime = getTime.now();
    
    setInterval(function () {
      console.log(`第${count}次开始 ${getTime.now() - startTime}`); // 显示开始时间
      sleep(500); // 程序滞留500ms
      console.log(`第${count}次结束 ${getTime.now() - startTime}`); // 显示结束时间
      count += 1;
    }, 300); // 300ms间隔
    

      为方便测试setTimeout,改一下

    function test(){
      console.log(`第${count}次开始 ${getTime.now() - startTime}`); // 显示开始时间
      sleep(500); // 程序滞留500ms
      console.log(`第${count}次结束 ${getTime.now() - startTime}`); // 显示结束时间
      count += 1;
    count>10 && clearInterval(t);
    }
    
    let count = 1;
    let getTime = window.performance;
    let startTime = getTime.now();
    
    var t = setInterval(test , 300); // 300ms间隔
    

      

    其他浏览器也一样,但是在NODE中

    改为setTimeout,结果也一样

    function sleep(time) {
      let startTime = window.performance.now();
      while (window.performance.now() - startTime < time) {}
    }
    
    function test(){
      console.log(`第${count}次开始 ${getTime.now() - startTime}  ID:${t}`); // 显示开始时间
      sleep(500); // 程序滞留500ms
      console.log(`第${count}次结束 ${getTime.now() - startTime}`); // 显示结束时间
      count += 1;
      count<10 && setTimeout(test,300);
    }
    
    let count = 1;
    let getTime = window.performance;
    let startTime = getTime.now();
    var t;
    test(); // 300ms间隔
    
    目前得出的结论:
    1. 标准中,setInterval()如果前一次代码没有执行完,则会跳过此次代码的执行。
    2. 浏览器中,setInterval()如果前一次代码没有执行完,不会跳过此次代码,而是将其插在队列中,等待前一次代码执行完后立即执行。
    3. Node中,setInterval()会严格按照间隔时间执行。

    链接:https://www.jianshu.com/p/0ad05e325f9b
  • 相关阅读:
    如何利用U盘重装系统
    对于python爬虫urllib库的一些理解(抽空更新)
    由pthread库版本不一致导致的段错误
    使用WinDBG调试OnDO Server
    直接输出蛇形矩阵
    在Windows 7 x64 上编译libsvn
    Visual Studio Express 2012 安装缺少头文件、库文件的问题
    元和网络的密码加密过程
    有道网络查词的简单分析
    统一项目管理平台(UMPLatForm.NET)【开发实例】之产品管理(WinForm)
  • 原文地址:https://www.cnblogs.com/7qin/p/10224287.html
Copyright © 2011-2022 走看看