javascript chiusura immediata valutazione

Question

Si consideri il seguente codice JavaScript:

var a = []; 

var f = function() { 

    for (var i = 0; i < 3; i++) { 
     a.push(function(){alert(i)}); 
    } 
    for (var j = 0; j < 3; j++) { 
     a[j](); 
    } 
}; 

Gli avvisi stampano '3' tutte e tre le volte. Voglio un comportamento diverso - in ogni iterazione del ciclo genera una funzione che stampa il valore corrente di i. Cioè 3 funzioni che stampano diversi indici.

Qualche idea?

Answer 1

Creare una funzione anonima che accetta i come parametro e restituisce che certa funzione:

for (var i = 0; i < 3; i++) { 
    a.push((function(i) { 
     return function() { 
      alert(i); 
     } 
    })(i)); 
} 

for (var j = 0; j < 3; j++) { 
    a[j](); 
} 

O fare qualcosa di simile: creare una funzione anonima che accetta i come parametro per aggiungere la funzione alla matrice:

for (var i = 0; i < 3; i++) { 
    (function(i) { 
     a.push(function() { 
      alert(i); 
     }); 
    })(i); 
} 

for (var j = 0; j < 3; j++) { 
    a[j](); 
} 

Answer 2

var iterate = (function() { 
    var i, j = []; 
    for (i = 0; i < 3; i += 1) { 
     j.push(i); 
     alert(j[j.length - 1]); 
    } 
}()); 

non è necessario la chiusura a solo uscita un valore. Il tuo codice dovrebbe, tuttavia, essere contenuto in una funzione per il contenimento orientato agli oggetti. Le funzioni non devono essere chiamate per essere eseguite.

Answer 3

funzione (i) {alert (i)

Answer 4

Solo un altro approccio, utilizzando currying:

var a = []; 
var f = function() { 
    for (var i = 0; i < 3; i++) { 
     a.push((function(a){alert(a);}).curry(i)); 
    } 
    for (var j = 0; j < 3; j++) { 
     a[j](); 
    } 
}; 

// curry implementation 
Function.prototype.curry = function() { 
    var fn = this, args = Array.prototype.slice.call(arguments); 
    return function() { 
    return fn.apply(this, args.concat(
     Array.prototype.slice.call(arguments))); 
    }; 
}; 

Controllare il frammento di codice in esecuzione here.

Answer 5

Si può mettere il corpo del vostro loop in una funzione anonima:

var a = []; 

for(var i = 0; i < 3; i++) (function(i) { 
    a.push(function() { alert(i); }); 
})(i) 

for(var j = 0; j < 3; j++) { 
    a[j](); 
} 

Con la creazione di quella funzione e passando il valore del ciclo di "i" come argomento, stiamo creando una nuova variabile "i" all'interno del corpo del loop che nasconde essenzialmente la "i" esterna. La chiusura che si preme sulla matrice ora vede la nuova variabile, il cui valore è impostato quando la funzione di funzione esterna viene chiamata nel primo ciclo. Questo potrebbe essere più chiaro se si usa un nome diverso quando creiamo la nuova variabile ... Questo fa la stessa cosa:

var a = []; 

for(var i = 0; i < 3; i++) (function(iNew) { 
    a.push(function() { alert(iNew); }); 
})(i) 

for(var j = 0; j < 3; j++) { 
    a[j](); 
} 

Il valore di "INEW" è assegnato 0, poi 1, poi 2 perché la funzione è chiamato immediatamente dal ciclo.