循环中的函数，为什么它们被认为是“错误”

Question

对于在循环中声明的复杂函数，我可以理解为什么我不想这样做，但为什么它会被认为是糟糕的 javascript？

当然，我们可以命名函数并将其置于循环之外，但会因为一些简单的事情（没有异步）而扰乱流程。

例如，下面是一个循环内的简单内联函数声明（JSHINT/LINT 抱怨，为什么这被认为是不可以？

for (var i = 0, len=arr.length; i < len; ++i) {

     dosomething(arr[i], function(returnvalue) {
         console.log(returnvalue);
     });

};

Answer 1

这是您不希望这样做的原因之一。该函数引用相同的变量。

http://jsfiddle.net/RCzyF/

var a = [];

for(var i=0; i<10; i++) {
    a.push(function () {
      return i; 
    });
}

h = "";
for(var j=0; j<10; j++) {
 h += "" + a[j]();   
}

alert(h);

人们可能希望看到0123456789，但它会将10 附加到h 10 次。当一个函数可能会改变其他函数的内容时，它会使代码非常难以理解。

这里有一个更复杂的例子，事情是如何出错的。

var a = [];

for(var i=0; i<10; i++) {
    a.push(function () {
      return i++; 
    });
}

h = "";
for(var j=0; j<10; j++) {
 h += "" + a[j]();   
}

alert(h);

创建函数时，它们指向相同的词法范围。当函数执行时，它们会改变函数内部的值，并且数组中的每个函数仍然指向相同的值。当变量被修改但您没有直接修改它时，这可能会导致非常难以调试的错误。

这也是来自 jslint 本身的真正答案：http://jslinterrors.com/dont-make-functions-within-a-loop/

Answer 2

在每次迭代中创建一个函数是无用的繁重。

大多数时候，在客户端 JavaScript 中，性能并不重要，也没有问题，但最好养成并保持良好的习惯，而不是稍后再优化代码（只要不妨碍可读性）。

这是您在每次迭代中创建一个新函数的证明：

var old;
function compare(_, a){
  if (old) console.log('equal ?', old==a);
  else old = a;
}
for (var i=0; i<2; i++){
  compare(i, function(i) { return i*i }); 
}

它记录'equal' ? false

testable jsbin