计时器计数太快

Question

我正在创建一个浏览器游戏，它会在游戏开始时有一个计时器。 我的东西运行良好，但我对 Javascript 相对较新，因此非常感谢有关程序结构的提示。

我的问题是我的计时器在应该计算秒的地方计算毫秒，在应该计算分钟的地方计算秒。

计时器.js

class Timer {           //timer works in s
    
    constructor() {
        this.curr = 0;
        this.initial_time = 0;
        this.t_status = false;
        this.curr_str;          //string for the current time
        this.old_timeStamp = 0;
        this.new_timeStamp = 0;
    }
    
    convert_to_str(s){  //converts time in secs to a mm:ss format
    
        console.log(s);
    
        let minutes = Math.trunc(s / 60);
        let secs = s % 60;
        let min_str;
        let secs_str;
        
        if (minutes < 10) {
            min_str = "0" + Math.trunc(minutes);
        } 
        else {
            min_str = Math.trunc(minutes).toString();
        }
        
        if (secs < 10) {
            secs_str = "0" + Math.trunc(secs);
        }
        else {
            secs_str = Math.trunc(secs).toString();
        }
        
        return min_str + ":" + secs_str;
        
    }
    
    set(s){         //sets time to sex seconds
        this.initial_time = s;
        this.curr = s;
        this.curr_str = this.convert_to_str(this.curr);
    }
    
    decrement(amount) {         //decrements the seconds timer
        this.curr = this.curr - amount;
        this.curr_str = this.convert_to_str(this.curr);
    }
    
    increment() {           //increments the seconds timer
        this.curr = this.curr + 1;
        this.curr_str = convert_to_str(this.curr);
    }
    
    clear() {
        this.curr = 0;
        this.curr_string = "";
        this.initial_time = 0;
    }
    
    get_time() {
        return this.curr_str;
    }   
    
    get_curr() {
        return this.curr;
    }   
}

main.js

function update(timeStamp) {
// Calculate the number of seconds passed since the last frame
timer.new_timeStamp = Date.now();
secondsPassed = (timer.new_timeStamp - timer.old_timeStamp) / 1000;

if (timer.t_status){
    console.log(secondsPassed);
    
    if (timer.get_curr() <= 0) {
        console.log("timer hit 0 stopping");
        timer.t_status = false;
    }
    else if ( secondsPassed >= 1 ){
        oldTimeStamp = Date.now();
        timer.decrement(1);
        
        console.log("changing timer to " + timer.get_time());
        
        $("#timer").html(timer.get_time());     //display current time string
    }
    
    console.log(timer.get_curr());
}

// Calculate fps
fps = Math.round(1 / secondsPassed);

// The loop function has reached it's end. Keep requesting new frames
window.requestAnimationFrame(update);
}

在整个更新function 中，我对 integer 文字进行了各种更改，但无论我更改什么数字，计数器的计数都相同吗？ 例如，起初我有if (secondsPassed >= 1)但程序具有相同的行为。

请帮忙：）

Answer 1

在 function convert_to_str中，您可以更改let minutes并let secs赋值为以下（注意，毫秒是您传递给convert_to_str函数的参数）： let minutes = milliseconds / 60000; 让秒 = 毫秒 / 1000 - 60 * 分钟；

Answer 2

代码有一些问题。 一方面，代码试图在不了解它是什么的情况下使用时间戳参数。 它与 Date.now() object 不同。

这个问题最简单的解决方案是在我的计时器 class 中制作我自己的时间戳。 在那之后。 我的代码运行良好。

计时器.js

class Timer {           //timer works in ms
    
    constructor() {
        this.curr = 0;
        this.initial_time = 0;
        this.t_status = false;
        this.curr_str;          //string for the current time
        this.old_timeStamp = 0;
        this.new_timeStamp = 0;
    }
    
    convert_to_str(s){  //converts time in secs to a mm:ss format
    
        console.log(s);
    
        let minutes = Math.trunc(s / 60);
        let secs = s % 60;
        let min_str;
        let secs_str;
        
        if (minutes < 10) {
            min_str = "0" + Math.trunc(minutes);
        } 
        else {
            min_str = Math.trunc(minutes).toString();
        }
        
        if (secs < 10) {
            secs_str = "0" + Math.trunc(secs);
        }
        else {
            secs_str = Math.trunc(secs).toString();
        }
        
        return min_str + ":" + secs_str;
        
    }
    
    set(s){         //sets time to sex seconds
        this.initial_time = s;
        this.curr = s;
        this.curr_str = this.convert_to_str(this.curr);
    }
    
    decrement(amount) {         //decrements the seconds timer
        this.curr = this.curr - amount;
        this.curr_str = this.convert_to_str(this.curr);
    }
    
    increment() {           //increments the seconds timer
        this.curr = this.curr + 1;
        this.curr_str = convert_to_str(this.curr);
    }
    
    clear() {
        this.curr = 0;
        this.curr_string = "";
        this.initial_time = 0;
    }
    
    get_time() {
        return this.curr_str;
    }   
    
    get_curr() {
        return this.curr;
    }   
}

main.js

function update(timeStamp) {

// Calculate the number of seconds passed since the last frame
timer.new_timeStamp = Date.now();
secondsPassed = (timer.new_timeStamp - timer.old_timeStamp) / 1000;

if (timer.t_status){
    console.log(secondsPassed);
    
    if (timer.get_curr() <= 0) {
        console.log("timer hit 0 stopping");
        timer.t_status = false;
    }
    else if ( secondsPassed >= 1 ){
        timer.old_timeStamp = Date.now();
        timer.decrement(1);
        
        console.log("changing timer to " + timer.get_time());
        
        $("#timer").html(timer.get_time());     //display current time string
    }
    
    console.log(timer.get_curr());
}

// Calculate fps
fps = Math.round(1 / secondsPassed);

// The loop function has reached it's end. Keep requesting new frames
window.requestAnimationFrame(update);
}