“设置间隔”内的“for”索引

Question

我有一个对象，我把它放在一个数组中，我用对数组进行迭代，对于数组中的每个对象，我用一个参数设置了一个调用对象方法的间隔，但是我不能。这是我的“班级”。

    function ClassTest() {
        this.test = function(word) {
            console.log(word);
        }
    }

我创建对象并将其放置在数组中：

    var array = [];
    var objectTest = new ClassTest();


    array.push(objectTest);

当我设定时间间隔时：

    for(var i = 0; i < array.length; i++) {
        array[i].loop = setInterval(function() {
            array[i].test("hello")
        }, 1000);
    }

问题是setInterval函数中的vari不存在，我可以创建一个varindex和它的存在，但我不理解为什么index存在而vari不存在：

    for(var i = 0; i < array.length; i++) {
        var index = i;
        array[i].loop = setInterval(function() {
            array[index].test("hello")
        }, 1000);
    }

当我不使用索引var:

Uncaught TypeError: Cannot read property 'test' of undefined




Answer 1

无论是否使用索引，您的尝试在这两种情况下都是不正确的。代码中只有一个i变量，当超时触发时，它将具有值数组。长度。

这是一个被称为“闭合循环变量”的问题，一种简单的解决方法是：

array.forEach(function (item) {
    item.loop = setInterval(function () {
        item.test("hello");
    }, 1000);
});

这个问题有几个答案可以深入解释您看到的行为的原因，但大多数投票率较高的答案在处理数组时过于复杂forEach是一条路要走。

Answer 2

匿名用户

因为您的for循环会立即执行。当你的setInterval（）第一次执行时，你的for循环将早已完成，你的i将在数组的范围之外。

在这个例子中，我们的数组的长度为3。当我们的for循环结束时，我们的i变量将等于3。如果我们在setTimeout中登录i，则数字3将在我们的JavaScript控制台中显示三次：

var array = [1, 2, 3];

for (var i = 0; i < array.length; i++) {
  setTimeout(function() {
    console.log(i);
  }, 1000);
}