Lors d'une boucle dans des fermetures JavaScript, comment conserver l'accès aux valeurs de variables uniques ?

Accès à une variable extérieure dans une boucle à partir d'une fermeture Javascript

En JavaScript, lors de l'utilisation d'une fermeture, la variable dans la boucle est référencée par un pointeur . Cela signifie que lorsque la boucle est terminée, la dernière valeur de la variable est utilisée, ce qui entraîne des divergences de fonctionnalité.

Pour résoudre ce problème, une technique appelée fermeture peut être utilisée. Une fermeture est essentiellement une fonction qui renvoie une fonction. En définissant la variable différemment à l'aide d'une fermeture, nous pouvons garantir que chaque itération de la boucle fait référence à sa propre valeur distincte de la variable.

Considérez le code suivant :

    for (var i in this.items) {
            var item = this.items[i];
            $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
            $("#showcasebutton_"+item.id).click( 
                // create an anonymous function that will scope "item"
                (function(item) {
                   // that returns our function 
                   return function() {
                    alert(item.id);
                    self.switchto(item.id);
                   };
                })(item) // immediately call it with "item"
            );
    }

Dans ce code modifié, une fonction anonyme est créée à chaque itération de la boucle qui prend la valeur actuelle de l'élément comme argument. Cela garantit que chaque gestionnaire de clics possède sa propre instance distincte de la variable d'élément.

Alternativement, la fonction d'assistance $.each() de jQuery peut être utilisée pour simplifier le code et éliminer le besoin d'une fermeture :

$.each(this.items,function(i, item) {
  $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
  $("#showcasebutton_"+item.id).click(function() {
    alert(item.id);
    self.switchto(item.id);
  });
});

En utilisant une fermeture ou $.each() de jQuery, nous pouvons garantir que chaque itération de la boucle a accès à sa propre valeur unique de la variable, résolvant ainsi le problème de l'accès aux variables extérieures en dehors de la boucle.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!