美文网首页前端笔记
关于setInterval 不准确的问题

关于setInterval 不准确的问题

作者: 小虫along | 来源:发表于2020-03-17 21:28 被阅读0次

在js中如果打算使用setInterval进行倒数,计时等功能有可能是是不准确的,
因为setInterval的回调函数并不是到时后立即执行,而是等系统计算资源空闲下来后才会执行.
而下一次触发时间则是在setInterval回调函数执行完毕之后才开始计时
所以如果setInterval内执行的计算过于耗时,或者有其他耗时任务在执行,setInterval的计时会越来越不准,延迟很厉害

    var startTime = new Date().getTime()
     var count = 0;
     setInterval(function(){
         var i =0;
         while(i++ < 100000000);
     }, 0);
    setInterval(function(){
        count++;
        console.log(new Date().getTime() - (startTime + count * 1000));
    }, 1000);

输出已下,延时会越来越大


timeout.png

为了js里可以使用相对准确的计时功能,我们可以用setTimeout代替setInterval,并在每次触发及时修正,可以减少积累造成的误差

var startTime = new Date().getTime()
     var count = 0;
     setInterval(function(){
         var i =0;
         while(i++ < 100000000);
     }, 0);
     function fixed() {
        count++;
        var offset = new Date().getTime() - (startTime + count * 1000);
        var nextTime = 1000 - offset;
        if (nextTime < 0) nextTime = 0;
        setTimeout(fixed, nextTime);
        
        console.log(new Date().getTime() - (startTime + count * 1000));
    }
    setTimeout(fixed, 1000);

相关文章

网友评论

    本文标题:关于setInterval 不准确的问题

    本文链接:https://www.haomeiwen.com/subject/xbixyhtx.html