打破setTimeout循环

Question

我在打破setTimeout循环时遇到了一些麻烦。

    for (var i = 0; i < 75; i++) {

        setTimeout(function(i) {

            return function() {

                console.log("turn no. " + i);

                if(table.game.playerWon) {
                    console.log('Player won');
                    // I want to stop the loop now
                    // i = 75; didn't work
                }

            };

        }(i), 100*i);

    }

我读过100个与setTimeout相关的帖子，但是无法想出这个帖子。

编辑：

让我在试图完成时稍微澄清一下。

我的游戏有75个回合，每回合需要大约500毫秒，在那个转弯期间我想检查是否满足条件并宣布玩家赢了，在玩家赢了之后没有必要继续其余的转动。

Answer 1

不是设置所有这些计时器，而是使用setInterval创建一个连续计时器：

var counter = 0;

var timer = setInterval(function () {

    console.log("turn no. " + counter);

    if (table.game.playerWon) {
        console.log('Player won');
    }

    if (counter >= 75 || table.game.playerWon) {
        clearInterval(timer);
    }

    counter++;

}, 100);

如果轮到您需要500毫秒，请将上一个100更改为500。

Answer 2

你不应该使用for循环，只是一个递归的setTimeout

• 了解the recursive setTimeout pattern
• 在说about 500ms时，我认为它不一定非常准确
• setInterval is harmful并且大多数开发人员可能都不知道它。

setInterval不适合这么多东西：

• 如果发生错误，您无法停止火车。
• 如果您需要不同的执行时间步骤。
• 如果您需要在链中传递数据。
• 如果你需要做一些异步的事。
• 更糟糕的是 - SETINTERVAL不保证执行
• 只有在你知道自己在做什么的时候才使用它！

解决方案：

var func = function(i){

    return function(){
        if (i >= 75) return;
        console.log("turn no. " + i);

        if(table.game.playerWon) {
            console.log('Player won');
        } else {
            setTimeout(func(++i), 500); 
        }

    }   
}

setTimeout(func(0), 500); 

如果要查看其工作原理，可以在node.js中运行它：

var winTurn = 10;

var func = function(i){

    return function(){
        if (i >= 75) return;
        console.log("turn no. " + i);

        if(i === winTurn) {
            console.log('Player won');
        } else {
            setTimeout(func(++i), 50); 
        }

    }   
}

setTimeout(func(1), 50); 

Answer 3

我认为使用setInterval而不是setTimeout会更好。

要清除它们，您可以将它们分配给变量，然后使用

清除超时

var myVar = setTimeout(func, time);
var myVar2 = setInterval(func, time);

clearTimeout(myVar);
clearInterval(myVar2);

Answer 4

以下是您应该写的内容的示例

var timeouts = [];
for (var i = 0; i < 75; i++) {

    timeouts[i] = setTimeout(function(i) {

        return function() {

            console.log("turn no. " + i);

            if(table.game.playerWon) {
                console.log('Player won');
                // I want to stop the loop now
                for(var k = i; k < timeouts.length; k++) {
                    clearTimeout(timeouts[i]);
                }
            }

        };

    }(i), 100*i);

}

另一个更简单的解决方法是setTimeout为假时只调用table.game.playerWon。

var timeoutFunction = function(i) {

    return function() {

        console.log("turn no. " + i);

        if(table.game.playerWon) {
            console.log('Player won');
            // Game stopped
        } else {
            timeout = setTimeout(timeoutFunction(i+1), 100);  
        }
    };

}

var timeout = setTimeout(timeoutFunction(0), 100);

希望有所帮助