Seltsame Dinge in JavaScript "for"

8

Ich benutze jQuery und ich habe eine seltsame Sache, die ich nicht verstehe. Ich habe einen Code:

%Vor%

"# some_button" wie der Name sagt - das sind einige Buttons. Wenn sie geklickt werden, sollten sie eine Box mit ihrer Nummer öffnen, richtig? Aber sie nicht. Wenn 4 Tasten vorhanden sind, wird immer "5" angezeigt (Anzahl der Tasten + 1). Warum ist das so?

    
dmitq 30.06.2010, 14:04
quelle

6 Antworten

18

Es hat mit JavaScript-Scoping zu tun. Sie können es leicht umgehen, indem Sie einen anderen Bereich einführen, indem Sie eine Funktion hinzufügen und diese Funktion sich selbst aufrufen lassen und i:

übergeben %Vor%

Dies erzeugt eine Schließung - wenn die innere Funktion Zugriff auf einen Bereich hat, der nicht mehr existiert, wenn die Funktion aufgerufen wird. Weitere Informationen finden Sie in diesem Artikel auf dem MDC.

EDIT: RE: Self-Calling-Funktionen: Eine Self-Calling-Funktion ist eine Funktion, die sich anonym nennt. Sie instanziieren es nicht, noch weisen Sie es einer Variablen zu. Es nimmt die folgende Form an (beachten Sie die öffnenden Parens):

%Vor%

In Bezug auf die Frage wäre der Körper der anonymen Funktion:

%Vor%

Kombinieren wir diese zusammen, erhalten wir die Antwort im ersten Codeblock. Die anonyme Self-Calling-Funktion erwartet ein Argument namens j . Es sucht nach einem Element mit einer ID von some_button mit dem Ganzzahlwert von j am Ende (z. B. some_button1, some_button10). Jedes Mal, wenn auf eines dieser Elemente geklickt wird, wird der Wert von j gemeldet. Die vorletzte Zeile der Lösung übergibt den Wert i . Dies ist der Schleifenzähler, in dem die anonyme selbstaufrufende Funktion aufgerufen wird. Auf andere Weise könnte es so aussehen:

%Vor%     
Hooray Im Helping 30.06.2010, 14:07
quelle
9

Sie haben ein sehr häufiges Schließungsproblem in der for -Schleife.

In einem Closing eingeschlossene Variablen teilen sich dieselbe einzelne Umgebung. Wenn also der Callback click aufgerufen wird, hat der Loop seinen Verlauf durchlaufen und die Variable i wird auf den letzten Eintrag zeigen.

Sie können dies mit noch mehr Schließungen lösen, indem Sie eine Funktionsfabrik verwenden:

%Vor%

Das kann ein ziemlich kniffliges Thema sein, wenn Sie nicht wissen, wie Schließungen funktionieren. Sie können sich den folgenden Mozilla-Artikel für eine kurze Einführung ansehen:

Daniel Vassallo 30.06.2010 14:09
quelle
2

Weil Sie in dem Moment, in dem Sie darauf klicken, i == 5.

    
Matteo Mosca 30.06.2010 14:09
quelle
0

Dies liegt daran, wie Verschlüsse in JavaScript funktionieren. Jede der fünf Funktionen, die Sie erstellen, teilt im Grunde dieselbe i Variable. Der Wert von i in Ihrer Funktion wird nicht ausgewertet, wenn Sie die Funktion erstellen, aber wenn das click-Ereignis eintritt, ist der Wert von i gleich 5.

Es gibt verschiedene Techniken, um dies zu umgehen (wenn dieses Verhalten nicht das ist, was Sie wollen). Eins (wenn Sie eine einfache Funktion haben, wie Sie hier tun) besteht darin, den Funktionskonstruktor anstelle eines Funktionsliterals zu verwenden:

%Vor%     
jhurshman 30.06.2010 14:11
quelle
-1
%Vor%

Wickeln Sie die Funktion nach draußen, denn für die Geschwindigkeit und die Tatsache werde ich das zurücksetzen.

    
RobertPitt 30.06.2010 14:09
quelle
-1

Das ist ein sehr cleverer Code. So clever ist es eine Frage zu SO. :) Ich würde die Frage ganz umgehen, indem ich den Code verdummte, nur um eine Chance zu haben, ihn in sechs Monaten zu verstehen (oder einen Kollegen verstehen zu lassen). Closures haben ihren Platz, aber in diesem Fall würde ich sie zugunsten eines verständlicheren Codes vermeiden.

Wahrscheinlich würde ich die gleiche Funktion an alle Tasten anhängen, die die Taste vom Ereignis erhalten würden, "some_button" von der ID abziehen und das Ergebnis alarmieren. Nicht annähernd so schön, aber ich garantiere jedem im Büro könnte es auf einen Blick folgen.

    
Ed Daniel 30.06.2010 15:20
quelle