javascript 实现准时的setTimeout

2023-12-14 12:43:34

1. 背景:

作为一个web前端开发工程师,需要经常与页面浏览器打交道,很多时候我们在项目中需要用到延迟来获取数据,比如直播页面,接口返回给我们一个时间,我们需要在时间到达后去执行一些操作,使用setTimeout会发现setTimeout 是不准的,因为 setTimeout 是一个宏任务,它的指定时间指的是:进入主线程的时间。

2. 实现准时的 “setTimeout”: setTimeout 系统时间补偿

当每一次定时器执行时后,都去获取系统的时间来进行修正,虽然每次运行可能会有误差,但是通过系统时间对每次运行的修复,能够让后面每一次时间都得到一个补偿。

function timer() { 
   var speed = 500, 
   counter = 1,  
   start = new Date().getTime(); 
    
   function instance() 
   { 
    var real = (counter * speed), 
    ideal = (new Date().getTime() - start); 
     
    counter++; 
 
    var diff = (ideal - real); 
    form.diff.value = diff; 
 
    window.setTimeout(function() { instance(); }, (speed - diff)); // 通过系统时间进行修复 
 
   }; 
    
   window.setTimeout(function() { instance(); }, speed); 
}

3. 结束: 通过系统的时间补偿,能够让我们的 setTimeout 变得更加准时。

文章来源:https://blog.csdn.net/qiaoqiaohong/article/details/134989843
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。