计时器延时问题

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. centos7.2 linux 64位系统上安装mysql

    1.在线安装mysql 在终端中命令行下输入(在官网下载mysql): # wget https://dev.mysql.com/downloads/repo/yum/mysql57-communit ...

  2. 记2017问鼎杯预赛的wp---来自一个小菜鸡的感想

    这次准备写一下几个misc和密码题目..很坑. 打了一整天的比赛,越来越觉得自己很菜了. 有一道题目叫做"真真假假",这道题目只有一个提示--Xor.第一眼知道是异或,也就知道这一 ...

  3. JSP静态化(伪静态)

    关于URLRewirte的用法:该方法只是实现了url的伪静态化,并不是真正的静态化. URLRewirte版本:urlrewrite-2.6.0.jar URLRewirte的用处: 1.满足搜索引 ...

  4. H264 NAL解析

    NAL全称Network Abstract Layer,即网络抽象层.在H.264/AVC视频编码标准中,整个系统框架被分为了两个层面:视频编码层面(VCL)和网络抽象层面(NAL).其中,前者负责有 ...

  5. netsh用法

    netsh(Network Shell) 是一个windows系统本身提供的功能强大的网络配置命令行工具. 导出配置脚本:netsh -c interface ip dump > c:\inte ...

  6. HTML协议详解

    一.实验环境搭建 因agileone很久没有更新,所以安装时需要注意版本.个人验证,如下版本可用: 1.XAMPP 实验版本:XAMPP for Windows Version 1.6.8 下载地址: ...

  7. MyBatis Generator配置示例

    (一).MBG介绍 MyBatis Generator(MBG)是一个Mybatis的代码生成器,它可以用来生成可以访问(多个)表的基础对象.MBG解决了对数据库操作有最大影响的一些简单的CRUD(插 ...

  8. Linux基础命令讲解(一)

    Linux命令基本格式: 命令 [参数] [路径文件] 方括号内容可省略 查看命令帮助手段: 1 man 命令名(man 还可以获取配置文件,函数的帮助) 2 命令 --help 3 help 命令( ...

  9. JavaScript面向对象基础与this指向问题

      前  言           我们的程序语言经历了从"面向机器".到"面向过程".再到"面向对象"的一个过程.而JavaScript是一 ...

  10. JavaScript设计模式--简单工厂模式例子---XHR工厂

    第一步,Ajax操作接口(目的是起一个接口检测作用) (1)引入接口文件 //定义一个静态方法来实现接口与实现类的直接检验 //静态方法不要写出Interface.prototype ,因为这是写到接 ...