可變變量的JS閉包

Question

請幫助我找出循環期間本地“j”變量繼續變化的原因：

var a1 = a2 = a3 = {};

for (var i = 1; i < 4; i ++ ) {
  (function(j){
    console.log(j);
    window['a'+j].fu = function(){
      console.log('fu:',j);
    };
  })(i);

}

a1.fu(); // returns "fu:,3" - why not 1?

a2.fu(); // returns "fu:,3" - why not 2?

a3.fu(); // returns "fu:,3"

我在類似的問題上閱讀了很好的答案，但這不符合我的情況。 可以通過閉包訪問可變變量。 我怎樣才能解決這個問題？

Answer 1

對象賦值不會復制對象，所有三個變量都會引用相同的對象。 因此，即使更改循環內的值也會更新不同對象的相同位置。

在循環的最后一次迭代中，對象中的值設置為3，並且在for循環后檢索值時，將為所有變量返回值3。

創建對象時

var a1 = a2 = a3 = {};

所有三個變量都指向同一個對象。

問題的解決方案可以單獨聲明對象。

 var a1 = {}, a2 = {}, a3 = {}; for (var i = 1; i < 4; i++) { (function(j) { console.log(j); window['a' + j].fu = function() { console.log('fu:', j); }; })(i); } a1.fu(); // returns "fu:,3" - why not 1? a2.fu(); // returns "fu:,3" - why not 2? a3.fu(); // returns "fu:,3" 

Answer 2

將a1 ， a2和a3 all分配給同一個對象的方式意味着它們對於同一個對象都是不同的名稱 ，即它們都引用相同的對象。

你的for循環然后運行三次，創建三個匿名函數。 在每個函數中， j具有不同的值，因此當您調用fu()時，您希望運行這些函數以顯示三個不同的值。

但是 ，由於a1 ， a2和a3都是相同的，所以循環的每次迭代都會覆蓋前一個fu() ，直到你只剩下嵌入值為j為3那個。

運行具有不同賦值的代碼，並觀察行為如何更改為您最初期望的內容：

var a1 = {};
var a2 = {};
var a3 = {};

Answer 3

查看每個變量，如指向對象的指針： var a = b = c = {}; 等於：

a
 \
  \
b-- {}
  /
 /
c

您不使用相同的變量來訪問對象，但每次都修改相同的對象。

嘗試：

a.test = 'fromA';
console.log(b.test); //fromA
console.log(c.test); //fromA