如何克服循環中的封閉污染：實用指南

循環內的閉包：解決閉包污染的實用指南

在程式設計中，閉包在從外部作用域捕捉變數方面發揮著至關重要的作用。然而，當在循環中使用時，它們可能會導致意想不到的結果，稱為閉包污染。本文探討了這個問題並提供了解決它的實用解決方案。

問題

考慮以下程式碼：

<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>

不幸的是，此程式碼輸出：

<code>My value: 3
My value: 3
My value: 3</code>

而不是：

<code>My value: 0
My value: 1
My value: 2</code>

而不是：

i i

而不是：

let

而不是：letlet i

而不是：

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

forEach

而不是：

forEach

<code class="javascript">var someArray = [/* values */];

someArray.forEach(function(element) {
  // ...code specific to this element...
});</code>

而非🎜>

問題forEach

問題的出現​​是因為循環中聲明的每個函數都從外部作用域捕獲相同的

變數。當函數在第二個循環中被呼叫時，它們都引用相同的

，在執行時它已增加到 3。

ES6 解：

<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>

i ES6 引入了

關鍵字，它會建立區塊作用域變數。在循環中使用 確保每次迭代都有自己不同的 變量，解決閉包污染問題：ES5.1 解決方案：另一個陣列的解決方案是使用 方法： 循環的每次迭代都會建立自己的閉包，並捕獲特定於該迭代的陣列元素。 經典解決方案：閉包經典的解決方案涉及手動將變數綁定到函數外部一個單獨的、不變的值：透過將 變數作為參數傳遞給內部函數函數時，我們為每次迭代建立一個新的閉包，確保每個函數引用自己的獨立值。

以上是如何克服循環中的封閉污染：實用指南的詳細內容。更多資訊請關注PHP中文網其他相關文章！