ループ内のクロージャが混乱を引き起こすのはなぜですか?それを解決するにはどうすればよいですか?

ループ内の JavaScript クロージャを理解する

問題:
提供されたコード内でのクロージャの使用法ループ内では混乱を招くようです。具体的には、二重括弧内の i の出現により、理解が困難になっています。

解決策: ファンクション ファクトリ

この問題に対処するには、ファンクション ファクトリと呼ばれる手法を使用できます。雇用される。関数をイベント ハンドラーに直接割り当てる代わりに、関数ファクトリを利用して目的の関数参照を生成できます。

コード例:

<code class="javascript">function generateMyHandler(x) {
  return function() {
    alert(x);
  };
}

for (var i = 0; i < 10; i++) {
  document.getElementById(i).onclick = generateMyHandler(i);
}</code>

説明:

このコードでは、パラメーター x を取るgenerateMyHandlerという名前の関数ファクトリを作成します。このファクトリーは、x の値を警告する関数を返します。ループ内で、i ごとにgenerateMyHandlerを呼び出し、返された関数をイベント ハンドラーに割り当てます。

問題の解決方法:

関数ファクトリを使用すると、次のことが可能になります。クロージャの作成を分離します。 i を引数としてファクトリ関数に渡すことにより、i への一意の参照を取得します。これにより、各クロージャが変数の独自のインスタンスを保持することが保証され、共有変数の問題が排除されます。

結論:

関数ファクトリを採用することで、競合や混乱が発生することなくループ内でクロージャを実行できます。この手法はコードを簡素化し、JavaScript のイベント ループ内でクロージャがどのように動作するかについての理解を深めます。

以上がループ内のクロージャが混乱を引き起こすのはなぜですか?それを解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。