使用代碼示例的Javascript關閉說明

Question

我想了解JavaScript關閉。我讀了一個示例代碼：

function buildList(list) { 
    var result = []; 
    for (var i = 0; i < list.length; i++) { 
    var item = 'item' + list[i]; 
    result.push(function() {alert(item + ' ' + list[i])}); 
    } 
    return result; 
} 

var fnlist = buildList([1,2,3]); 
// using j only to help prevent confusion - could use i 
for (var j = 0; j < fnlist.length; j++) { 
    fnlist[j](); 
} 

此代碼將打印出「item3 undefined」警報3次。我確實理解第5行項目變量中的「3」，但我不明白爲什麼從第5行的列表[i]打印出「undefined」？這是不是也使用閉包訪問列表變量？有人能解釋這一點嗎？

Answer 1

您確實可以訪問所有這些變量。問題是你的i變量在下面的循環中：

for (var i = 0; i < list.length; i++) { 
    var item = 'item' + list[i]; 
    result.push(function() {alert(item + ' ' + list[i])}); 
    } 

我通過引用傳遞，每增加一個循環。所以，當你將閉包推入循環3次，我的值是4，每個回調都會嘗試提醒[1,2,3]（你提供的數組）的第4個元素，這是未定義的。

Answer 2

最快的解釋是：閉包圍繞函數創建，而不圍繞語句創建！

試試這個就知道是什麼意思：

function createClosure(item, val) { 
    return function() {alert(item + ' ' + val)}; 
} 

function buildList(list) { 
var result = []; 
    for (var i = 0; i < list.length; i++) { 
    var item = 'item' + list[i]; 
    result.push(createClosure(item, list[i])); 
    } 
    return result; 
}