Heim > Artikel > Web-Frontend > So überwinden Sie Schließungsverschmutzung in Schleifen: Ein praktischer Leitfaden
In der Programmierung spielen Abschlüsse eine entscheidende Rolle bei der Erfassung von Variablen aus äußeren Bereichen. Wenn sie jedoch innerhalb von Schleifen verwendet werden, können sie zu unerwarteten Ergebnissen führen, die als „Closure Pollution“ bezeichnet werden. Dieser Artikel untersucht dieses Problem und bietet praktische Lösungen zu seiner Lösung.
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](); }</code>
Leider gibt dieser Code Folgendes aus:
<code>My value: 3 My value: 3 My value: 3</code>
statt:
<code>My value: 0 My value: 1 My value: 2</code>
Das Problem entsteht, weil jede innerhalb der Schleife deklarierte Funktion dieselbe i
-Variable aus dem äußeren Bereich erfasst. Wenn die Funktionen innerhalb der zweiten Schleife aufgerufen werden, verweisen sie alle auf dasselbe i
, das zum Zeitpunkt ihrer Ausführung auf 3 erhöht wurde.
let
ES6 hat das Schlüsselwort let
eingeführt, das blockbezogene Variablen erstellt. Durch die Verwendung von let
innerhalb der Schleife wird sichergestellt, dass jede Iteration ihre eigene i
-Variable hat, wodurch das Problem der Verschlussverschmutzung gelöst wird:
<code class="javascript">for (let i = 0; i < 3; i++) { funcs[i] = function() { console.log("My value:", i); }; }</code>
forEach
Eine andere Die Lösung für Arrays ist die Verwendung der forEach
-Methode:
<code class="javascript">var someArray = [/* values */]; someArray.forEach(function(element) { // ...code specific to this element... });</code>
Jede Iteration der forEach
-Schleife erstellt ihren eigenen Abschluss und erfasst das für diese Iteration spezifische Array-Element.
Die klassische Lösung besteht darin, die Variable manuell an einen separaten, unveränderlichen Wert außerhalb der 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); } for (var j = 0; j < 3; j++) { funcs[j](); }</code>
Durch Übergabe der i
-Variable als Argument an die innere Funktion Funktion erstellen wir für jede Iteration einen neuen Abschluss und stellen so sicher, dass jede Funktion auf ihren eigenen unabhängigen Wert verweist.
Das obige ist der detaillierte Inhalt vonSo überwinden Sie Schließungsverschmutzung in Schleifen: Ein praktischer Leitfaden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!