Wie kann beim Schleifen in JavaScript-Abschlüssen der Zugriff auf eindeutige Variablenwerte aufrechterhalten werden?

Zugriff auf äußere Variablen in der Schleife über einen Javascript-Abschluss

In JavaScript wird bei Verwendung eines Abschlusses durch einen Zeiger auf die Variable innerhalb der Schleife verwiesen . Dies bedeutet, dass nach Abschluss der Schleife der letzte Wert der Variablen verwendet wird, was zu Funktionsunstimmigkeiten führt.

Um dieses Problem zu lösen, kann eine Technik namens „Closure“ eingesetzt werden. Ein Abschluss ist im Wesentlichen eine Funktion, die eine Funktion zurückgibt. Indem wir die Variable mithilfe eines Abschlusses unterschiedlich festlegen, können wir sicherstellen, dass sich jede Iteration der Schleife auf ihren eigenen eindeutigen Wert der Variablen bezieht.

Bedenken Sie den folgenden Code:

    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"
            );
    }

In diesem Durch den geänderten Code wird in jeder Iteration der Schleife eine anonyme Funktion erstellt, die den aktuellen Wert des Elements als Argument verwendet. Dadurch wird sichergestellt, dass jeder Click-Handler über eine eigene eindeutige Instanz der Elementvariablen verfügt.

Alternativ kann die $.each()-Hilfsfunktion von jQuery verwendet werden, um den Code zu vereinfachen und die Notwendigkeit eines Abschlusses zu beseitigen:

$.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);
  });
});

Durch die Verwendung eines Abschlusses oder von $.each() von jQuery können wir sicherstellen, dass jede Iteration der Schleife Zugriff auf ihren eigenen eindeutigen Wert der Variablen hat, wodurch das Problem des Zugriffs auf externe Variablen außerhalb der Schleife gelöst wird.

Das obige ist der detaillierte Inhalt vonWie kann beim Schleifen in JavaScript-Abschlüssen der Zugriff auf eindeutige Variablenwerte aufrechterhalten werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!