以可变速度递增计数器

Question

我正在用 JavaScript 创建一个增量游戏（比如 CookieClicker，如果你玩过的话）。

以 CookieClicker 为例，您每秒生成一定数量的 cookie。如果您每秒制作 700 个 cookie，则计数器每秒增加 1 个 cookie 700 次（或看起来如此）。

目前在我的游戏中，如果你每秒制作 700 个“cookie”，计数器将每秒增加 700 个“cookie”，而不是平稳地增加一个固定数量。

我不知道如何做到这一点。我创建了一个函数来计算您每秒制作的“cookie”数量，我尝试使用该数字将window.setInterval() 的时间参数设为变量，但我什至不确定这是否可能更不用说实用了.

我很确定这不是正确的方法，但我还是会发布相关代码：

function getManaPerSecond(){
    manaPerSecond = earthEssence + (windEssence * 5) + (waterEssence * 10) + 
    (fireEssence * 150);
};

window.setInterval(function(){
    getManaPerSecond();
}, 1000);

window.setInterval(function(){
    if(manaPerSecond>0){
        incrementalMana++;
     document.getElementById('incrementalMana').innerHTML = incrementalMana;
 }
 }, (1000/manaPerSecond));

Answer 1

每当频率发生变化，就需要停止旧的区间函数，重新开始。

var manaCounter;
var oldManaPerSecond = 0;
function restartManaCounter(manaPerSecond) {
    if (manaPerSecond != oldManaPerSecond) {
        clearInterval(manaCounter);
        oldManaPerSecond = manaPerSecond;
        if (manaPerSecond > 0) {
            manaCounter = setInterval(function() {
                incrementalMana++;
                document.getElementById('incrementalMana').innerHTML = incrementalMana;
            }, 1000/manaPerSecond);
        }
    }
}

function getManaPerSecond(){
    var manaPerSecond = earthEssence + (windEssence * 5) + (waterEssence * 10) +  (fireEssence * 150);
    return manaPerSecond;
};

window.setInterval(function() {
    restartManaCounter(getManaPerSecond());
}, 1000);