Question

我正在Manning的书《用JavaScript编程》（约翰·拉尔森）中学习JavaScript。在清单11.8的第11章中，代码：

var getCounter = function () {
    var counter = 0;
    var countUpBy1 =  function () {
        counter = counter + 1;
        return counter;
    };  
    return countUpBy1;
};
var count = getCounter();

我正在使用jsbin.com进行实验和学习。在控制台中：

Q1）为什么调用count（），结果并不总是1？为什么会这样，在开始countCountBy1之前将counter设置为0，不应该将countUpBy1内部的counter也设置为0？

Q2）为什么调用getCounter（）与count（）不同？调用count（）会给我一个数字（这是我期望的数字），但是调用getCounter（）会给我：

function () {
    counter = counter + 1;
    return counter;
}

感谢您提前解释。

4/11月： @DavidFleeman：我对第一个问题的理解是否正确（我阅读了所有3个链接，以及JavaScript Closures 101: What is a closure，I never understood JavaScript closures和JavaScript Closures Explained by Mailing a Package：

（删除了我对逐步关闭的理解）

11月11日： I never understood JavaScript closures 多次阅读此链接，它比我能更好地解释。

Answer 1

为什么调用count（）并不总是等于1？

这些嵌套方法创建一个闭包，其中初始化仅发生一次，并且每次都返回嵌套的内部方法。请阅读此链接以了解：

https://www.w3schools.com/js/js_function_closures.asp

如果您喜欢MDN，请使用以下链接。但是，上面的链接提供了一些示例，我相信它与该成员的情况相符：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

更详细地说，这似乎是一个经过深思熟虑的解释：

https://blogs.msdn.microsoft.com/ericlippert/2003/09/17/what-are-closures/

为什么getCounter（）返回函数对象而不是执行方法？

通过阅读上面的相同链接，您可以看到如何定义getCounter（）来完全按照您的要求进行操作。您必须将其定义为自调用函数。在您的示例中，未使用自调用语法定义它。如果要使用getCounter（）而不是count（）定义它，请参见下面的示例。

var getCounter = (function () {
  var counter = 0;
  var countUpBy1 =  function () {
    counter = counter + 1;
    return counter;
  };  
  return countUpBy1;
})();
getCounter();

变量调用函数和直接调用函数

1 个答案: