全局上下文中的函数

Question

我知道调用没有“new”关键字的函数会将其所有属性吐出到全局上下文中。但是我看到了一些奇怪的行为，这段 Javascript 代码：

function Test3() {
  var a=0;

  this.inc = function() {
    return ++a;
  };

  this.noInc = function() {
    return a;
  };

  this.testRef = function() {
    return this;
  };

  return {
    inc: inc,
    testRef: testRef,
    noInc: noInc
  };
}

var o = Test3();      // Put func properties on global context
var o2 = Test3();     // Put func properties on global context (replacing properties above??)

// Both "o" and "o2" maintain their own copy of "a" (closure)

alert("o:  " + o.inc());        
alert("o:  " + o.inc());        
alert("o:  " + o.inc());        // Will output 3 (as expected)

alert(noInc());                   // Output: 1 (This seems to not be affected by o.inc() calls - expected)

// However...
alert("o2: " + o2.inc());
alert("o2: " + o2.inc());
alert("o2: " + o2.inc());       
alert("o2: " + o2.inc());       // Will output 4 (as expected)

alert(noInc());                 // Will output 4 (seems to share with o2), but why?


alert(o === window);             // false    
alert(o.testRef() === o);        // true     (I thought testRef() would be on global context?)
alert(o.testRef() === window);   // false    (^^)

alert(o2 === window);            // false
alert(o2.testRef() === o2);      // true     (I thought testRef() would be on global context?)
alert(o2.testRef() === window);  // false    (^^)

alert(testRef() === window);     // true     (How come this is here? Look at comments above)

1. 当我们调用var o = Test() 时，这里到底发生了什么？ Test() 在什么上下文中执行。由于缺少new 关键字，我相信Test3() 中的this 会引用窗口？ “o”指的是什么？它只是在全局上下文中声明的变量吗？

2. 如果以上为真，那么 o 和 o2 如何能够维护 Test3 的局部变量“a”的单独副本。我知道我们在这里有闭包，但是为什么“o2”和“window”共享变量“a”的相同副本，而不是“o”

3. 当我执行 var o = Test3() 然后执行 alert(o.testRef() === window) 时，它显示为 false。所以执行后：

   var o = Test3();
   var o2 = Test3();
   

Test3() 的属性似乎有 3 个副本。一个在“o”上，另一个在“o2”上，一个在全局上下文上。

但是“o”和“o2”上怎么会有任何 - 我没有用“new”关键字调用Test3()，所以这应该只指全局上下文？

Answer 1

每次调用 Test3 时，inc、noInc 和 testRef 函数都会重新分配给 window，并使用不同的 a（在函数顶部初始化为 0 .)

window 和o2 共享相同的a，因为当o2 获得返回值而不是o1 时，函数被重新分配给window。

来自 NodeJS REPL 的示例（注意在 NodeJS 中，全局对象由 global 引用，而不是 window，否则应该没有任何区别）：

> function Test3() {
...   var a=0;
... 
...   this.inc = function() {
...     return ++a;
...   };
... 
...   this.noInc = function() {
...     return a;
...   };
... 
...   this.testRef = function() {
...     return this;
...   };
... 
...   return {
...     inc: inc,
...     testRef: testRef,
...     noInc: noInc
...   };
... }
undefined
> var o = Test3();
undefined
> o.inc()
1
> o.inc()
2
> o.inc()
3
> noInc()
3

因为Test3 只被调用一次并设置为o1，所以全局范围和o1 共享一个a。现在看我再次拨打Test3：

> Test3()
{ inc: [Function],
  testRef: [Function],
  noInc: [Function] }
> noInc()
0
> o.noInc()
3

函数被重新分配给全局对象，a 为 0，而 o 保留之前的 a。

Answer 2

您的代码可以简化为：

var inc, noinc, a = 0, a2 = 0;
inc = function () {
   a += 1;
}
noinc = function () {
   return a;
}
inc();
inc();
inc();
noinc(); // 3

inc = function () {
   a2 += 1;
}
noinc = function () {
   return a2;
}
// now inc and noinc are bound to a2
noinc(); // 0, yours gives 1?

所以基本上你会覆盖绑定到不同a 的inc 和noinc 的定义。

如果您使用this.a = this.a || 0 而不是var a = 0，您将绑定到相同 a。