成员函数修改对象状态不持久？Node.js模块模式作用域与引用问题

咱们一步一步拆解你遇到的问题，核心是闭包变量和对象属性的区别，以及JavaScript中原始值与引用值的处理逻辑：

第一个版本代码的问题根源 #

先看你最初的Component1实现：

module.exports = function () {
  var count = 0;
  function listener(e) {
    console.log(typeof randomString);
    console.log(count);
    count++;
  }
  return { count: count }
}

这里有两个关键问题：

1. 原始值的复制特性：你返回的对象里的count是内部闭包变量count的副本。因为count是原始类型（number），当你写return { count: count }时，相当于把当前count的数值（0）复制了一份放到返回对象的count属性里。这就意味着，内部闭包的count和返回对象的count是完全独立的两个值——事件处理器里的count++修改的是闭包里的变量，和components.compA.count没有任何关系，所以你在Main里打印它永远是初始的0。
2. 作用域的限制：事件处理器里的randomString找不到，是因为这个变量不存在于当前作用域（闭包作用域或全局作用域）。randomString是你后来添加到返回对象上的属性，而事件处理器的作用域只能访问闭包内声明的变量和全局变量，自然拿不到这个属性，所以输出undefined。

第二个版本为什么能解决问题 #

再看修改后的Component1：

module.exports = function () {
  var count = 0;
  var _this;
  function listener(e) {
    console.log(typeof _this.randomString);
    console.log(_this.count);
    _this.count++;
  }
  function init() {
    _this = this;
  }
  return { count : count, init: init }
}

以及你在Main里调用的components.compA.init()，这里的核心是对象引用的绑定：

1. 当你调用components.compA.init()时，函数init里的this指向的就是components.compA这个返回的对象（因为是通过对象调用的方法），所以_this就保存了这个对象的引用。
2. 事件处理器里通过_this.randomString访问的是对象本身的属性，自然能拿到你后来添加的"Hello"，所以输出string。
3. 更重要的是，_this.count++直接修改的是返回对象的count属性——因为_this是对象的引用，操作的是同一个对象，所以这个修改会直接反映到components.compA.count上，状态也就持久化了。

这里要注意：此时内部闭包的count变量其实已经被弃用了，你操作的都是对象本身的属性，所以两次事件触发后，components.compA.count会变成2，和你看到的输出0、1完全对应（第一次输出当前值0然后加1，第二次输出1然后加1）。

内容的提问来源于stack exchange，提问作者Empha