如何实现精准的setTimeout

hykeda2年前JS1815

setTimeout 是不准的。因为 setTimeout 是一个宏任务,它的指定时间指的是:进入主线程的时间。

setTimeout(callback, 进入主线程的时间)

所以什么时候可以执行 callback,需要看 主线程前面还有多少任务待执行

function timer(speed) { 
   counter = 1,  
   start = new Date().getTime();  
   window.setTimeout(function() { instance(speed,counter,start); },speed); 
} 

function instance (speed,counter,start) { 
    //其他自己的逻辑 自己写上去
    

    var real = (counter * speed), //真实执行时间
    ideal = (new Date().getTime() - start); //系统执行时间
    var diff = (ideal - real);//真实执行时间差距
    counter++; //执行次数
    window.setTimeout(function() { instance(speed,counter,start); },(speed - diff)); // 通过系统时间进行修复 ,第二次执行时间变成了执行时间减去误差时间,等于执行时间间隔缩短了。修正了之前的误差
 
}; 

timer(1000);


标签: setTimeout

相关文章

js获取键盘事件keyCode都是229原因

今天在操作空格键和enter键时出现键盘keyCode值都是229,导致特定的键盘事件没有触发。经过查询,原来是因为在中文输入法下,使用 keydown 事件时,绝大部分的键盘ASCII码值都是229...

js 对象合并和数组合并

1、对象的扩展运算符(...)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中。let obj1 = {     name:...

JavaScript图片延迟加载微型库Echo.js

JavaScript图片延迟加载微型库Echo.js

JavaScript图片延迟加载微型库Echo.js Echo.js是一个标准的独立的Javascript图片懒加载(延迟加载)库,它非常小巧快速,只有2KB,它使用HT...

19个提高工作效率的JavaScript单行代码

1. 生成随机字符串当我们需要一个唯一id时,通过Math.random创建一个随机字符串简直不要太方便噢!!!const randomString = () ...

20个js工具函数助力高效开发

前言日常开发中,面对各种不同的需求,我们经常会用到以前开发过的一些工具函数,把这些工具函数收集起来,将大大提高我们的开发效率。1、校验数据类型export const typeOf...

介绍几款有用的图表插件

大家在开发一些系统的时候会用到很多统计的图表,我在做统计报表的时候用过挺多图表插件的,现在推荐大家几款优秀、稳定、可靠、大公司开发的图表体统。 1、Highcharts Highchart...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。