封閉混亂的Javascript

Question

示例1：http://jsfiddle.net/ufCr8/

function createFunctions() { 
    var result = new Array(); 

    for (var i = 0; i < 10; i++) { 
     result[i] = function() { 
      return i; 
     }(); 
    } 

    return result; 
} 

var funcs = createFunctions();  
for (var i = 0; i < funcs.length; i++) { 
    document.write(funcs[i] + "<br />"); 
} 

示例2：http://jsfiddle.net/T5shB/

function createFunctions() { 
    var result = new Array(); 

    for (var i = 0; i < 10; i++) { 
     result[i] = function(num) { 
      return function() { 
       return num; 
      }; 
     }(i); 
    } 

    return result; 
} 

var funcs = createFunctions(); 
for (var i = 0; i < funcs.length; i++) { 
    document.write(funcs[i]() + "<br />"); 
} 

爲什麼這兩個得到不同的結果？

Answer 1

這兩個工作都正常。 （並有相同的結果）。

樣品＃1：

for (var i = 0; i < 10; i++) { 
    result[i] = function() { 
     return i; 
    }(); // note function application! 
} 

匿名功能被執行右然後，其結果是許多i每次迭代通過循環（當前）值。這實際上與result[i] = i相同。不是很令人興奮。 （在打印出數值的循環中，沒有函數應用程序，如果不是函數，它將作爲數字出現錯誤 - 在這種情況下，它與以下示例不同）。

樣本＃2：

for (var i = 0; i < 10; i++) { 
    result[i] = function(num) { 
     return function() { 
      return num; 
     }; 
    }(i); 
} 

施加外匿名函數返回一個封閉其正確「雙結合」被傳遞作爲num的i的電流值（num實際上是結合自由變量）。請記住，函數引入了一個新的範圍 - var（或for）沒有。

我懷疑「失敗的情況下」將是：

for (var i = 0; i < 10; i++) { 
    result[i] = function() { 
     return i; 
    }; // note function NOT invoked here! 
} 

... 
for (var i = 0; i < funcs.length; i++) { 
    document.write(funcs[i]() + "<br />"); 
} 

這將產生「奇怪的結果」，因爲它是在每個封閉約束（即i是相同i自由變量和只有一個i）。因此，當執行該功能時，它將在執行點處返回i的當前值。

快樂編碼

---

我會推薦閱讀Jibbering JavaScript Closure Notes - 這不是最初級的資源，但我覺得它可以訪問它足夠詳細解釋的事情。 （而且遠遠超過ECMAScript規範（IMOHO）的可讀性。