Heim >Web-Frontend >js-Tutorial >Können JavaScript-Abschlüsse innerhalb von Schleifen den Variablenbereich unterbrechen?

Können JavaScript-Abschlüsse innerhalb von Schleifen den Variablenbereich unterbrechen?

DDD
DDDOriginal
2024-10-16 17:51:02831Durchsuche

Can JavaScript Closures Inside Loops Break Variable Scoping?

JavaScript-Abschlüsse in Schleifen: Ein einfaches praktisches Beispiel

In JavaScript tritt ein häufiges Problem auf, wenn Schleifen zum Erstellen von Funktionen verwendet werden, die ihren Index oder Wert protokollieren. Trotz der Absicht, unterschiedliche Werte zu protokollieren, protokollieren alle Funktionen aufgrund der Art des Variablenbereichs häufig denselben Wert.

Das Problem

Bedenken Sie den folgenden Code:

<code class="javascript">var funcs = [];
for (var i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
}

for (var j = 0; j < 3; j++) {
  funcs[j](); // Outputs: "My value: 3" three times
}</code>

Anstatt „Mein Wert: 0“, „Mein Wert: 1“ und „Mein Wert: 2“ auszugeben, wird dreimal „Mein Wert: 3“ protokolliert. Dieses Verhalten bleibt in verschiedenen Szenarios bestehen, einschließlich der Verwendung von Ereignis-Listenern oder asynchronem Code.

Lösung 1: ES6 let

ES6 führt das Schlüsselwort let ein, das Variablen erstellt, die auf ihren umschließenden Block beschränkt sind. Durch die Verwendung von let in der Schleife wird sichergestellt, dass jede Funktion ihre eigene Variable hat:

<code class="javascript">for (let i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
}</code>

Lösung 2: ES5.1 forEach

Für Szenarien, bei denen über Arrays iteriert wird, ist forEach Methode bietet eine praktische Lösung. Jeder Rückruf in der forEach-Schleife verfügt über einen eigenen Abschluss, der für jede Iteration eine eindeutige Variable bereitstellt:

<code class="javascript">someArray.forEach(function(arrayElement) {
  console.log("My value:", arrayElement);
});</code>

Lösung 3: Klassische Abschlüsse

In älteren JavaScript-Versionen können Abschlüsse verwendet werden um eine Variable an einen bestimmten Wert innerhalb einer Funktion zu binden:

<code class="javascript">var funcs = [];

function createfunc(i) {
  return function() {
    console.log("My value:", i);
  };
}

for (var i = 0; i < 3; i++) {
  funcs[i] = createfunc(i);
}</code>

Das obige ist der detaillierte Inhalt vonKönnen JavaScript-Abschlüsse innerhalb von Schleifen den Variablenbereich unterbrechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn