Как я могу исправить это закрытие в функции списка?

Question

В этом very good Stack Overflow answer приведен пример того, как замыкания могут работать интуитивно, когда возвращаются анонимные функции в списке.

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

function testList() { 
    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](); 
    } 
} 

Этот код возврата:

item2 undefined 
item2 undefined 
item2 undefined 

Мой вопрос - как бы вы изменить этот код так, что он возвращает результат мы ожидаем?

item0 1 
item1 2 
item2 3 

Answer 1

Используйте IIFE в петле for в buildList и передать в i.

Это будет гарантировать, что i прошел в будет оставаться заключенным в IIFE закрытии и не будет изменено i в for петли

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

 
function testList() { 
 
    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](); 
 
    } 
 
} 
 

 
testList();