NodeJS倒计时实现

NodeJS倒计时实现与事件循环机制

最新推荐文章于 2023-10-06 16:21:08 发布

原创最新推荐文章于 2023-10-06 16:21:08 发布 · 758 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #开发语言

本文探讨了在NodeJS中实现倒计时的挑战，由于事件循环机制，使用setTimeout和setInterval可能导致计时不准确。通过记录倒计时结束时间并实时获取剩余时间来校正倒计时，虽然确保准确性，但可能会出现倒计时跳跃现象。

项目中需要实现倒计时的功能，以前做IOS时，可以利用NSTimer或者GCD时间定时任务，在定时触发的方法中对倒计时的时长-1，达到0后，倒计时结束。但是这种方法在JS中并不可行，会出现计时不准确的问题，造成这个问题的原因是事件循环机制。

在NodeJS中，一般通过setTimeout和setInterval两个方法实现定时触发任务，setTimeout和setInterval是将任务加入到任务队列，但是这些任务并不会被立即执行，而是要等待之前的任务执行完毕后才会调用，如果任务的计算比较耗时，就会造成技术的不准确，例如setInterval每1秒执行计时任务，setInterval每1秒钟就会向任务队列中添加计时任务，但是并不代表每一秒就会执行计时任务。

这样的就通过校正的方法来实现倒计时功能。

class CountDownTimer {
    private timer: NodeJS.Timer
    private endTime: number = 0

    public startTimer(duration: number) {
        const nowDate = new Date()
        this.endTime = nowDate.getTime() + duration
        this.doTimer()
    }

    public stopTimer() {
        if (this.timer) {
            clearTimeout(this.timer)
        }
    }

    private doTimer() {
        const nowDate = new Date()
        const leftTime = this.endTime - nowDate.getTime()
        
        if (leftTime >= 0) {
            // TODO: 其他操作
            this.timer = setTimeout(() => {
                this.doTimer()
            }, 1000)
        } else {
            this.stopTimer()
        }
    }
}

记录倒计时的结束时间，在每次计时方法中获取最新的剩余时间，这样虽然倒计时是准确的，但是如果计时方法比较耗时，会出现倒计时跨数值跳跃的现象。