为什么为同一函数调用window.setTimeout不会引入无限循环？

Question

我看到了以下代码：

class MasterControlPanel {
    private sensors: Sensor[] = [];
    constructor() {
        // Instantiating the delegate HeatSensor
        this.sensors.push(new HeatSensor(this));
    }

    start() {
        for (var i= 0; i < this.sensors.length; i++) {
            // Calling the delegate
            this.sensors[i].check();
        }
        window.setTimeout(() => this.start(), 1000);
    }

    startAlarm(message: string) {
        console.log('Alarm! ' + message);
    }
}

var cp = new MasterControlPanel();
cp.start();

为什么window.setTimeout(() => this.start(), 1000); 不引入无限循环？

根据我的理解， cp.start()将首先迭代sensor内部的每个sensors ，然后调用window.setTimeout ，该方法又会在延迟1秒后再次调用start 。

参考：清单3-3。 Pro TypeScript中的委托：应用程序级JavaScript开发

Answer 1

简而言之，它不会引入无限循环，因为setTimeout不会阻塞。 而是将您赋予它的函数执行（）=> this.start（）添加到队列中，并在经过1秒后执行。 start方法在调用window.setTimeout之后返回，因此从命令意义上讲不会导致无限循环。 在大多数情况下，代码将处于等待状态，直到下一个计时器出现。

代码无限地调度计时器以调用start方法也是正确的，但它不是无限循环，因为它将控制权返回给javascript运行时。

Answer 2

确实引入了无限循环，每个调用之间延迟了1秒

window.setTimeout(() => this.start(), 1000);

几乎与

var _this = this; 
window.setTimeout(function(){ _this.start(); }, 1000);

它被称为箭头功能

Answer 3

也许您需要setInterval 。 那将创建一个无限循环，您可以使用clearInterval清除该循环。

this.interval = window.setInterval(() => {
...
}, 5000);

window.clearInterval(this.interval);

你也可以做

this.sensors.forEach(sensor => sensor.check())

而不是使用for循环。

Answer 4

您不能在setTimeout中使用它，因为它引用的是setTimeout，而不是您的类。 尝试这个 ：

class MasterControlPanel {
    private sensors: Sensor[] = [];
    constructor() {
        // Instantiating the delegate HeatSensor
        this.sensors.push(new HeatSensor(this));
    }
    var that = this;
    start() {
        for (var i= 0; i < this.sensors.length; i++) {
            // Calling the delegate
            this.sensors[i].check();
        }
        window.setTimeout(() => that.start(), 1000);
    }

    startAlarm(message: string) {
        console.log('Alarm! ' + message);
    }
}

var cp = new MasterControlPanel();
cp.start();