javascript fermeture évaluation immédiate

Question

Considérez ce qui suit le code 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](); 
    } 
}; 

Les alertes imprimer sur '3' trois fois. Je veux un comportement différent - dans chaque itération de la boucle générer une fonction qui imprime la valeur actuelle de i. C'est à dire. 3 fonctions qui impriment différents index.

Des idées?

Answer 1

Créer une fonction anonyme qui accepte i comme paramètre et retourne cette fonction particulière:

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

Ou quelque chose de similaire: créer une fonction anonyme qui accepte i comme paramètre pour ajouter la fonction au tableau:

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

Vous n'avez pas besoin de fermeture à une valeur de sortie uniquement. Votre code devrait, cependant, être contenu dans une fonction de confinement orienté objet. Les fonctions n'ont pas besoin d'être appelées pour être exécutées.

Answer 3

fonction

(i) {alert (i)

Answer 4

Juste une autre approche, en utilisant 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))); 
    }; 
}; 

Vérifiez l'extrait ci-dessus en cours d'exécution here.

Answer 5

Vous pouvez mettre le corps de votre boucle dans une fonction anonyme:

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

En créant cette fonction et passer la valeur de la boucle de « i » comme argument, nous créons une nouvelle variable « i » à l'intérieur du corps de la boucle qui cache essentiellement le "i" externe. La fermeture que vous poussez sur le tableau voit maintenant la nouvelle variable, dont la valeur est définie lorsque la fonction de fonction externe est appelée dans la première boucle. Cela pourrait être plus clair si nous utilisons un nom différent lorsque nous créons la nouvelle variable ... Cela fait la même chose:

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

La valeur de « iNew » est attribué 0, 1, puis 2 parce que la fonction est appelé immédiatement par la boucle.