0

有人可以（清楚而简洁地）向我解释为什么这段代码会这样工作吗？我来自 Java（6 和 7）中的强类型背景，其中不存在闭包，也不像在 javascript 中那样运行。我认为与这个问题相关的概念是：闭包和范围链。

这是示例：

var myfuncs = function() {
    var funcs = []
    var i;
    for (i = 0; i < 10; i++) {
       funcs[i] = function() { console.log(i); }
    }
    return funcs;
}

var allfuncs = myfuncs();
allfuncs.forEach(function(fn) { fn(); });

上面的例子记录了 9（10 次），但期望和我自己的直觉认为它会记录 0-9。

为什么这会像在 Javascript 中那样工作？闭包非常强大，但我试图一劳永逸地掌握这个概念！稍加修改的示例会产生正确的输出，但为什么呢？

var myfuncs = function() {
    var funcs = []
    var i;
    for (i = 0; i < 10; i++) {
       funcs[i] = (function(index) { console.log(index); })(i);
    }
    return funcs;
}

var allfuncs = myfuncs();
allfuncs.forEach(function(fn) { fn(); });

闭包不是 Javascript 独有的，但我想看看为什么它们在实际编写 javascript 以与浏览器/dom 交互的上下文中如此强大。

有没有人有很好的、实用的例子来说明我们在与浏览器/dom 交互时如何应用闭包技术？

谢谢。

4

1 回答 1

1

在您拥有的示例中，它非常简单。

在您的第一个示例中，只有一个变量i，并且所有内容都引用该单个值。所以..它打印了9十次。每个函数都捕获了该更改的共享值。i

在第二个示例中，您使用的是闭包。每个函数都有一个名为的私有变量index，它接收——这是重要的部分——值的副本i。

因此，您可以0通过，9因为有十个函数，每个函数都有一个私有index变量，并且每个变量都会获得当时存在index的快照。i

这种较长形式的闭包可能会有所帮助：

function myFactory(index) {
  return function() {
    console.log(index);
  }
}

var myfuncs = function() {
    var funcs = []
    var i;
    for (i = 0; i < 10; i++) {
       funcs[i] = myFactory(i);
    }
    return funcs;
}

var allfuncs = myfuncs();
allfuncs.forEach(function(fn) { fn(); });
于 2014-04-12T04:46:46.297 回答