Как сделать анонимные функции с локальными параметрами

Question

Как я могу сделать это предупреждение javascript 0, 1 и 2 вместо 3 3?

var vals = [1, 2, 3];
for(var i = 0; i < vals.length; i++)
{
    window.setTimeout(function() {alert(i);}, 1000);
}

Я знаю причину, почему это делает, но я не могу понять, как пройти i анонимной функции.

Answer 1

Вы можете завернуть это в замыкание следующим образом:

var vals = [1, 2, 3];

for(var i = 0; i < vals.length; i++) {
    (function(num) {
        window.setTimeout(function() {alert(vals[num]);}, 1000);
     })(i);
}

Попробуйте: http://jsfiddle.net/qgL7h/

Answer 2

var vals = [1, 2, 3];
function makeCallback(i)
{
    return function () {alert(i);};
}
for(var i = 0; i < vals.length; i++)
{
    window.setTimeout(makeCallback(i), 1000);
}

Answer 3

Строго не обязательно передавать i в функцию, ее можно присвоить локальной переменной внутри.

var vals = [1, 2, 3];

for(var i = 0; i < vals.length; i++) {
    (function() {
        var num = i
        window.setTimeout(function() {alert(vals[num]);}, 1000);
     })();
}

Требуется "function () {block} ()", потому что в Javascript не было правильных блочных лексических переменных. В последних выпусках добавлено «let», что делает это возможным:

var vals = [1, 2, 3];

for(var i = 0; i < vals.length; i++) {
    let num = i
    window.setTimeout(function() {alert(vals[num]);}, 1000);
}