Javascript 为什么迭代器变量不断重置？

我有一个填充了数字的数组。我想在

警报（）弹出窗口中每隔5秒显示一个新号码。我所做的大部分工作似乎正常，但在显示数字3之前它会重置。首先显示1，然后显示2，然后再次显示1。我想不出来。如果可以的话，我想在大多数情况下保持这种语法。我只是不明白为什么
计数器一直重置为0

var arr = [1, 2, 3, 4, 5];
var maxLoops = Number(arr.length);
var counter = -1;

(function next() {
    if (counter++ > maxLoops);
    setTimeout(function() {
        alert(arr[counter]);
        next();
    }, 5000);
})();

不要不断重置计数器，只需不断增加计数器并使用
%
运算符即可。例如：

var arr = [1,2,3,4,5],
    counter = 0

setInterval(function() {
    alert(arr[counter++%arr.length])
}, 5000)

代码的主要部分如下所示：

alert(
  counter++ // Will increase variable after statement
  % // Modulus Operator: Basically Remainder
  arr.length // The length of the array
)

这里的问题是，
计数器的值可能在设置计时器和调用其中的匿名函数之间发生变化。为缓解此问题，必须将
计数器的值
传递到计时器函数中

var arr = [1, 2, 3, 4, 5];
var maxLoops = Number(arr.length) - 1;
var counter = -1;

(function next() {
    if (counter++ >= maxLoops) return;
    setTimeout((function (c) {
        return (function() {
            alert(arr[c]);
            next();
        });
    })(counter), 5000);
})();

就我个人而言，我想写如下：

var arr = [1, 2, 3, 4, 5];

(function next(counter) {
    if (counter < arr.length) {
        setTimeout(function () {
            alert(arr[counter]);
            next(counter + 1);
        }, 5000);
    }
})(0);

我建议你这样做：

var arr = [1, 2, 3, 4, 5];
var maxLoops = Number(arr.length);
var counter = 0;

(function next() {
    if (counter >= maxLoops) return;
    setTimeout(function() {
        alert(arr[counter++]);
        next();
    }, 5000);
})();

您需要放入
return
语句以指示函数必须完成，否则，它将继续执行setTimeout和计数器递增的值
 这对我来说很好，我无法重现错误。这是一个更大计划的一部分吗？可能
计数器
正在代码中的其他位置重置。
如果
末尾有一个分号，则整行仅递增计数器
setTimeout
总是被调用。您可能想在行尾没有分号，您可能想要
if（counter++
。请注意，所有计时器和主执行行共享一个
计数器的实例。没有什么可以阻止它在您调用
setTimeout
的时间和它调用超时回调的时间之间进行更改。好的，您所说的是正确的。你错过了一个分号，但一旦我加上它，我就可以在它重置之前得到3。我也能在它重置之前到达4。但大多数情况下，它会在3点后重置。编辑：无需担心。这根本没用。如果将持续时间设置为1秒，它将变为3，但如果将持续时间设置为5秒，它将在2后重置为0。能否提供有关此代码的更多上下文？您在哪个环境中运行它？您的代码的另一部分是否可能正在重置计数器，因为它是一个全局变量？这可能不一定解决问题，但它确实解决了问题中实现的明显问题。此代码修复了
if
问题，并在
setTimeout
中捕获
计数器的值（如
c
），保留该值直到计时器回调发生。我在浏览器扩展中使用此代码（确切地说是TamperMonkey）我认为它被扩展头中的
@match
变量重置了。因此，当页面刷新时，扩展将重置脚本。我可能应该为
计数器
使用会话或其他东西。如果页面正在刷新，那么脚本确实会重新启动。您是否尝试过一起设置超时功能？
var arr = [1, 2, 3, 4, 5];
var maxLoops = Number(arr.length);
var counter = 0;

(function next() {
    if (counter >= maxLoops) return;
    setTimeout(function() {
        alert(arr[counter++]);
        next();
    }, 5000);
})();