javascript - 根据耗时更新变量

Question

我目前有以下代码:

<div id="resource1"></div>
<div id="resource2"></div>
<div id="resource3"></div>


<script>

var resource1 = 50;
var resource2 = 50;
var resource3 = 50;

var modifier = 3;

function resourcesupdates() {
    setInterval(function() {
            resource1 = resource1 + modifier;
            resource2 = resource2 + modifier;
            resource3 = resource3 + modifier;
            document.getElementById('resource1').innerText = resource1;
            document.getElementById('resource2').innerText = resource2;
            document.getElementById('resource3').innerText = resource3;

            console.log(resource1);

     }, 1000);
}

resourcesupdates();
</script>

此代码之所以有效，是因为资源每秒更新 3 个。

如果我想让它以每分钟 47 次的速度更新怎么办，但是我希望它仅在资源更新为整数时才输出给用户，而不是每秒更新一次，因为那样会导致十进制值？

Answer 1

正如我在上面的评论中所述:问题是，当以每秒 47/60 的速度更新时，您可能永远不会达到数字没有小数位的点。如果在数字总是四舍五入显示时仍然满足您的要求，这可能是您的解决方案:

var resource1 = 50;
var resource2 = 50;
var resource3 = 50;

var modifier = 47; // per minute

function resourcesupdates() {
    setInterval(function() {
            resource1 = resource1 + modifier/60;
            resource2 = resource2 + modifier/60;
            resource3 = resource3 + modifier/60;
                        
            document.getElementById('resource1').innerText = Math.round(resource1);
            document.getElementById('resource2').innerText = Math.round(resource2);
            document.getElementById('resource3').innerText = Math.round(resource3);
     }, 1000);
}

resourcesupdates();

<div id="resource1"></div>
<div id="resource2"></div>
<div id="resource3"></div>

如果您希望始终向下舍入，正如您对其他问题的评论中所要求的，只需将 Math.round() 替换为 Math.floor()。