具有多个 for 循环的函数的已定义错误

Question

我有以下功能：

self.aFunction = function(otherAll, all){
    for(var i = 0; i < all.length; i++){
        ...
    }
    for(var i = 0; i < otherAll.length; i++){
        ...
    }
    return someResult;
};

我有两个 for 循环，它们都使用变量 "i"。它们没有共同之处，分别用于每个循环。

但是，我从 jshint 得到以下错误：

'i' is already defined.

这有什么问题吗？为什么对同一函数中的每个循环使用其他变量很重要？在这种情况下，这是我应该关心的问题吗？

Answer 1

从实用的角度来说，在您的示例中重复使用相同的变量是很好的，但是通过两次声明它，您给人的印象是您认为它的范围在 for 循环中。它不是，这就是 JSHint 给您通知的原因：确保它实际上不是代码中的错误。

如果要复用i，只需声明一次：

self.aFunction = function(otherAll, all){
    var i;
    for(i = 0; i < all.length; i++){
        ...
    }
    for(i = 0; i < otherAll.length; i++){
        ...
    }
    return someResult;
};

或者，如果 all 和 otherAll 是数组，请查看 forEach 或 my other answer here 中的许多其他选项。

如果您能够使用 ES2015 功能（例如，您知道所有目标环境都支持它们，或者您正在转译），然后：

您可以使用 let:

self.aFunction = function(otherAll, all){
    for(let i = 0; i < all.length; i++){
        ...
    }
    for(let i = 0; i < otherAll.length; i++){
        ...
    }
    return someResult;
};

用let声明的i将限定在for循环中（以一种非常有趣的方式，不少于¹).

或者如果你不需要索引而只想要循环中的值，并且 all 和 otherAll 是可迭代的（数组是可迭代的），请使用 let with新 for-of:

self.aFunction = function(otherAll, all){
    for(let value of all){
        ...
    }
    for(let value of otherAll){
        ...
    }
    return someResult;
};

¹ "...以一种非常有趣的方式，不少于..."：在for (let i = 0; i < all.length; i++)中有实际上每个循环迭代一个 different i ，它从循环增量部分之前的前一个 i 的值中获取它的值，这很有用如果您在循环中创建闭包——它们会在 i 迭代中关闭 :

// let...
for (let i = 0; i < 5; ++i) {
  setTimeout(function() {
    console.log("i = " + i);
  }, i * 100);
}

// ...vs. var
setTimeout(function() {
  for (var j = 0; j < 5; ++j) {
    setTimeout(function() {
      console.log("j = " + j);
    }, j * 100);
  }
}, 500);

具有多个 for 循环的函数的已定义错误

Already defined error for functions with multiple for loops

javascript

jshint