javascript - 函数触发10次后如何实现clearTiimeout？模拟掷骰子

使用javascript，我正在尝试模拟骰子掷骰子。我正在使用setTimeout，但我想在函数运行了设定的次数后执行clearTimeout，例如说10次。这就是我希望它起作用的方式。

用户单击一个按钮。然后他们看到div中显示了一系列骰子值（显然是1-6）。然后，大约说了十遍，该功能停止了。

怎么能做到？我到目前为止的代码非常简单。

function rollDice(){
diceVal = Math.floor(Math.random() * 7);
$('.dice-display').html(diceVal);
setTimeout(rollDice, 500);

// 10次后清除超时
    }

$('.rollDiceButton').click(function(){
rollDice();

});

最佳答案

这是闭包的理想用例：

var rollDice = ( function rollDiceClosure(){
    var iterations = 0;

    return function rollDice(){
        var diceVal = Math.floor(Math.random() * 7);

        $('.dice-display').html(diceVal);

        if( ++iterations >= 10 ){
            setTimeout(rollDice, 500);
        }
    }
}() );

闭包为iterations变量创建一个空间。在setTimeout语句之前，iterations加1。如果等于或大于10，则不会设置超时。