首页 > 解决方案 > 我无法理解闭包的示例

问题描述

请我理解关闭。为什么计数器在第一个变体中有效,但在第二个版本中没有?

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

console.log(counter());
console.log(counter());
console.log(counter());

计数器输出 0,1,2

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

console.log(counter()());
console.log(counter()());
console.log(counter()());

计数器输出 0,0,0

有什么区别?

标签: javascriptclosures

解决方案


在第一个示例中,您使用的是Immediately Inovked Function Expression。这是调用内联函数并将结果函数分配给计数器。每次调用 counter() 时,您都在调用在范围内具有 count 变量的内部函数。

第二个例子相当于写成

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

以这种方式编写时,更清楚的是,每次调用 counter() 时,都会返回一个函数,其中count变量在范围内

在第二个示例中,您可以通过将结果分配给一个变量并多次调用该变量来执行等效操作。

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

var counterObj = counter();

counterObj(); // returns 0
counterObj(); // returns 1
counterObj(); // returns 2

推荐阅读