计时器延时问题

js计时器


使用setTimeout、setInterval函数时,第二个参数的设置的时间间隔t是自该函数(setTimeout(f1,t)、setInterval(f1,t))被调用时起,经过t毫秒后,f1被加入UI任务队列,但不一定执行,尤其是在期间有其他任务执行时,所以可能会有时间延时。因此使用setInterval函数制作计时器时,会出现延时。

 注意:
javascript在遇到setInterval时足够机智,只有当任务队列中没有该定时器的实例时,才会将定时器代码添加到任务队列中。因此,定时器代码被添加到任务队列的最小时间间隔为指定的时间间隔,即至少需要经过指定的时间间隔interval,定时器才会被添加
 
setInterval(fun,interval)
 
 
  1. var startTime = new Date().getTime();
  2. var count = 0;
  3. /*setInterval(function(){
  4. var i = 0;
  5. while(i++ < 100000000);
  6. }, 0);*/
  7. function fixed() {
  8. count++;
  9. var offset = new Date().getTime() - (startTime + count * 1000);
  10. var nextTime = 1000 - offset;
  11. if (nextTime < 0) nextTime = 0;
  12. setTimeout(fixed, nextTime); //纠正延时
  13. console.log(new Date().getTime() - (startTime + count * 1000));
  14. }
  15. setTimeout(fixed, 1000);

setInterval计时器延时问题的更多相关文章

  1. 解决setInterval计时器不准的问题

    在js中如果打算使用setInterval进行倒数,计时等功能,往往是不准确的,因为setInterval的回调函数并不是到时后立即执行,而是等系统计算资源空闲下来后才会执行.而下一次触发时间则是在s ...

  2. setTimeout setInterval 计时器

    setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式. 返回值:返回一个 ID(数字),可以将这个ID传递给 clearTimeout() 来取消执行. 案例: 点击按钮开始,停止时 ...

  3. 【转】JS中setTimeout和setInterval的最大延时值详解

    前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...

  4. JS window对象取消计时器clearInterval() clearInterval() 方法可取消由 setInterval() 设置的交互时间。

    取消计时器clearInterval() clearInterval() 方法可取消由 setInterval() 设置的交互时间. 语法: clearInterval(id_of_setInterv ...

  5. JS Window对象 计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码。

    计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码. 语法: setInterval(代码,交互时间); 参数说明: 1. 代码:要调用的函数或要执行的代码串. 2. 交互 ...

  6. 关于setInterval的坑

    一道面试题:“setInterval和setTimeout有什么区别” “如果setInterval计时器的回调函数执行完需要5秒,而计时器时间间隔为3秒,那会发生什么?” 验证代码 让程序滞留固定时 ...

  7. js_计时器之setInterval

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 定时器setTimeout()和setInterval()使用心得整理

    JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成. 一.setTimeout() setTimeout函 ...

  9. VUE长按事件

    PS:在开发中常常会有长按事件的需求,这里我简单的介绍几种长按事件的需求 需求一:长按数字累加或者累减 HTML: <div class="mui-numbox" data- ...

随机推荐

  1. 多线程进阶---Thread.join()/CountDownLatch.await() /CyclicBarrier.await()

    Thread.join() CountDownLatch.await() CyclicBarrier.await() 三者都是用来控制程序的"流动" 可以让程序"堵塞&q ...

  2. Maven(六)之依赖管理

    前面讲了maven一些关于Maven的简单知识,今天我给大家分享一些Maven的依赖管理.我相信用过maven的人都知道,它很重要的功能就是通过依赖来添加jar包. 让我们领略一下Maven是怎么管理 ...

  3. vue组件初学--弹射小球

    1. 定义每个弹射的小球组件( ocicle ) 2. 组件message自定义属性存放小球初始信息(可修改) { top: "0px", //小球距离上方坐标 left: &qu ...

  4. HDFS概述(5)————HDFS HA

    HA With QJM 目标 本指南概述了HDFS高可用性(HA)功能以及如何使用Quorum Journal Manager(QJM)功能配置和管理HA HDFS集群. 本文档假设读者对HDFS集群 ...

  5. 51nod 1118 机器人走方格 解题思路:动态规划 & 1119 机器人走方格 V2 解题思路:根据杨辉三角转化问题为组合数和求逆元问题

    51nod 1118 机器人走方格: 思路:这是一道简单题,很容易就看出用动态规划扫一遍就可以得到结果, 时间复杂度O(m*n).运算量1000*1000 = 1000000,很明显不会超时. 递推式 ...

  6. Linux修改hostname的几种方法

    修改hostname有几种方式 1:  hostname DB-Server                            --运行后立即生效(新会话生效),但是在系统重启后会丢失所做的修改 ...

  7. BS4爬取糗百

    -- coding: cp936 -- import urllib,urllib2 from bs4 import BeautifulSoup user_agent='Mozilla/5.0 (Win ...

  8. Vue阻止冒泡

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. Qt+VS2015应用程序发布

    本文以Qt 5.9.1+VS2015编译环境为例介绍应用程序发布流程,也适用于Qt+mingw的情况. 1. Qt依赖库 将需要发布的exe(如test.exe),放到单独的目录. 在"开始 ...

  10. 设置QT应用程序图标方法(Windows下)

    学习笔记,言简意赅. 1- 新建文本文件,编辑输入  IDI_ICON1   ICON    DISCARDABLE     "./image/WindowIco.ico" 注意: ...