Javascript 为什么在我的SetInterval中没有调用my函数？

这是我第一次使用JS类。我在一个函数中有一个setInterval，但是这个函数应该是重复的，但我不确定为什么不是

    class Stopwatch 
    {
    constructor(isRunning, timer, timerTime)
    {
        this.isRunning = isRunning;
        this.timer = timer;
        this.timerTime = timerTime; 
    }
    init()
    {
    // Put the element on the page with an id of start in a variable
    // Do the same for the stop button and the reset button
    const startButton = document.getElementById("start");
    const stopButton = document.getElementById("stop");
    const resetButton = document.getElementById("reset");


    // Add an onclick handler to each of the buttons
    // Use the functions startTimer, stopTimer and resetTimer 
    startButton.onclick = this.startTimer;
    stopButton.onclick = this.stopTimer;
    resetButton.onclick = this.resetTimer;
    }
    startTimer() 
    {
        // if the timer is NOT running, start it
        // call the function incrementTimer every second
        // save the timer in a the timer variable

        if(!this.isRunning)
        {
            this.isRunning = true;
            this.timer = setInterval(this.incrementTimer, 1000);

        }
    }

    incrementTimer() 
    {
        // increment the timerTime
        // calculate the number of minutes and seconds
        this.timerTime++;
        let minutes = Math.floor(this.timerTime / 60);
        let seconds = this.timerTime % 60;
        // write the minutes and seconds to the elements on the page
        // use the function pad to make sure there's a leading 0 if necessary
        document.getElementById("minutes").innerHTML = this.pad(this.minutes);
        document.getElementById("seconds").innerHTML = this.pad(this.seconds);

    }

    pad(number) 
    {
        // add a leading 0 if the number is < 10
        if(number < 10)
            number = "0" + number;

        return number;
    }

    stopTimer() 
    {
        // if the timer is running, stop it
        if(this.isRunning)
        {
            isRunning = false;
            timer = clearInterval(timer);
        }

    }

    resetTimer() 
    {
        // stop the timer
        this.stopTimer();

        // set the timerTime back to 0
        this.timerTime = 0;

        // write 00 to the elements on the page for minutes and seconds
        document.getElementById("minutes").innerHTML = "00";
        document.getElementById("seconds").innerHTML = "00";
    }
}



let stopwatch = new Stopwatch(false, null, 0);

// When the page has finished loading, call the function init
window.onload = stopwatch.init();

class秒表
{
构造函数（isRunning、timer、timerTime）
{
this.isRunning=isRunning；
this.timer=计时器；
this.timerTime=timerTime；
}
init（）
{
//将id为start的元素放在变量中
//对停止按钮和复位按钮执行相同操作
const startButton=document.getElementById（“开始”）；
const stopButton=document.getElementById（“停止”）；
const resetButton=document.getElementById（“重置”）；
//向每个按钮添加onclick处理程序
//使用startTimer、stopTimer和resetTimer功能
startButton.onclick=this.startTimer；
stopButton.onclick=this.stopTimer；
resetButton.onclick=this.resetTimer；
}
startTimer（）
{
//如果计时器未运行，则启动它
//每秒调用函数incrementTimer
//将计时器保存在计时器变量中
如果（！this.isRunning）
{
this.isRunning=true；
this.timer=setInterval（this.incrementTimer，1000）；
}
}
递增计时器（）
{
//增加时间
//计算分钟数和秒数
这个.timerTime++；
分钟=数学地板（this.timerTime/60）；
让秒数=this.timerTime%60；
//将分钟和秒写入页面上的元素
//如有必要，使用功能板确保前导0
document.getElementById（“分钟”）.innerHTML=this.pad（this.minutes）；
document.getElementById（“seconds”）.innerHTML=this.pad（this.seconds）；
}
pad（编号）
{
//如果数字小于10，则添加前导0
如果（数字<10）
number=“0”+数字；
返回号码；
}
停止计时器（）
{
//如果计时器正在运行，请停止它
如果（此.isRunning）
{
isRunning=false；
定时器=清除间隔（定时器）；
}
}
重置计时器（）
{
//停止计时
这个.stopTimer（）；
//将timerTime设置回0
this.timerTime=0；
//将00写入页面上的元素，持续几分钟和几秒钟
document.getElementById（“分钟”）.innerHTML=“00”；
document.getElementById（“秒”）.innerHTML=“00”；
}
}
让秒表=新秒表（false，null，0）；
//页面加载完成后，调用函数init
window.onload=stopwatch.init（）；

当您设置元素的

onclick

属性时，您分配的函数将始终使用设置给元素的

此

值进行调用。因此，您尝试访问的

此

的属性将不会被定义

而不是：

startButton.onclick = this.startTimer;

用于设置调用函数时使用的

此
值：

startButton.onclick = this.startTimer.bind(this);

此外，增加计时器的代码不正确：

let minutes = Math.floor(this.timerTime / 60);
let seconds = this.timerTime % 60;
document.getElementById("minutes").innerHTML = this.pad(this.minutes);
document.getElementById("seconds").innerHTML = this.pad(this.seconds);

this.minutes
未定义，因为您使用
let
来声明分和秒。取而代之的是，只需使用变量的名称来引用变量，即
minutes
和
seconds

document.getElementById("minutes").innerHTML = this.pad(minutes);
document.getElementById("seconds").innerHTML = this.pad(seconds);

当您停止计时器时，您忘记在您试图访问的属性前面添加
此

这：

应该是：

if(this.isRunning){
  this.isRunning = false;
  this.timer = clearInterval(this.timer);
} 

演示：



开始
停止
重置
:
阶级秒表
{
构造函数（isRunning、timer、timerTime）
{
this.isRunning=isRunning；
this.timer=计时器；
this.timerTime=timerTime；
}
init（）
{
//将id为start的元素放在变量中
//对停止按钮和复位按钮执行相同操作
const startButton=document.getElementById（“开始”）；
const stopButton=document.getElementById（“停止”）；
const resetButton=document.getElementById（“重置”）；
//向每个按钮添加onclick处理程序
//使用startTimer、stopTimer和resetTimer功能
startButton.onclick=this.startTimer.bind（this）；
stopButton.onclick=this.stopTimer.bind（this）；
resetButton.onclick=this.resetTimer.bind（this）；
}
startTimer（）
{
//如果计时器未运行，则启动它
//每秒调用函数incrementTimer
//将计时器保存在计时器变量中
如果（！this.isRunning）
{
this.isRunning=true；
this.timer=setInterval（this.incrementTimer.bind（this），1000）；
}
}
递增计时器（）
{
//增加时间
//计算分钟数和秒数
这个.timerTime++；
分钟=数学地板（this.timerTime/60）；
让秒数=this.timerTime%60；
//将分钟和秒写入页面上的元素
//如有必要，使用功能板确保前导0
document.getElementById（“分钟”）.innerHTML=this.pad（分钟）；
document.getElementById（“秒”）.innerHTML=this.pad（秒）；
}
pad（编号）
{
//如果数字小于10，则添加前导0
如果（数字<10）
number=“0”+数字；
返回号码；
}
停止计时器（）
{
//如果计时器正在运行，请停止它
如果（此.isRunning）
{
this.isRunning=false；
this.timer=清除间隔（this.timer）；
}
}
重置计时器（）
{
//停止计时
这个.stopTimer（）；
//将timerTime设置回0
this.timerTime=0；
//将00写入页面上的元素，持续几分钟和几秒钟
document.getElementById（“分钟”）.innerHTML=“00”；
document.getElementById（“秒”）.innerHTML=“00”；
}
}
让秒表=新秒表（false，null，0）；
//当页面显示为h时
if(this.isRunning){
  this.isRunning = false;
  this.timer = clearInterval(this.timer);
}