So behalten Sie Variablenwerte in JavaScript-Ereignis-Listenern bei: Blockbezogene Variablen oder Abschlüsse?

So behalten Sie Variablenwerte in Ereignis-Listenern in JavaScript bei

Bedenken Sie den folgenden Codeausschnitt:

<code class="javascript">for (var i = 0; i < results.length; i++) {
  marker = results[i];
  google.maps.event.addListener(marker, 'click', function() {
    change_selection(i);
  });
}

In In diesem Code ist der im Ereignis-Listener verwendete Wert von i immer der Endwert von results.length nach Beendigung der Schleife. Um dieses Problem zu lösen, müssen wir den Wert von i während seiner Erstellung an den Ereignis-Listener übergeben.

Verwenden von Variablen mit Blockbereich (ES6 und höher)

In In modernen Browsern können wir blockbezogene Variablen wie let oder const verwenden. Auf diese Variablen kann nur innerhalb des Blocks zugegriffen werden, in dem sie definiert sind. Durch die Verwendung einer blockbezogenen Variablen können wir sicherstellen, dass der Wert von i zum Zeitpunkt der Ereigniserstellung erhalten bleibt.

<code class="javascript">for (let i = 0; i < results.length; i++) {
  let marker = results[i];
  google.maps.event.addListener(marker, 'click', () => change_selection(i));
}</code>

Erstellen eines Abschlusses (ältere Browser)

In älteren Browsern, die keine blockbezogenen Variablen unterstützen, können wir einen Abschluss erstellen, um den Wert von i beizubehalten. Ein Abschluss ist eine Funktion, die eine andere Funktion kapselt und so einen verschachtelten Bereich erstellt. Indem wir i als erstes Argument an eine anonyme Funktion übergeben, können wir einen Abschluss erstellen, der den Wert von i beibehält.

<code class="javascript">for (var i = 0; i < results.length; i++) {
  (function (i) {
    marker = results[i];
    google.maps.event.addListener(marker, 'click', function() {
      change_selection(i);
    });
  })(i);
}</code>

Durch die Verwendung entweder der blockbezogenen Variablen oder der Abschlusstechnik können wir dies sicherstellen Jeder Ereignis-Listener verwendet den beabsichtigten Wert von i.

Das obige ist der detaillierte Inhalt vonSo behalten Sie Variablenwerte in JavaScript-Ereignis-Listenern bei: Blockbezogene Variablen oder Abschlüsse?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!