ホームページ > ウェブフロントエンド > jsチュートリアル > ## イベント リスナーで変数値を保持する方法: 値渡しか参照渡しか?

## イベント リスナーで変数値を保持する方法: 値渡しか参照渡しか?

Mary-Kate Olsen
リリース: 2024-10-25 03:27:29
オリジナル
623 人が閲覧しました

## How to Preserve Variable Values in Event Listeners: Pass by Value or by Reference?

イベント リスナーでの変数値の保持: 値による受け渡しと参照による受け渡し

ループ内で変数を代入し、イベント リスナーを追加する場合、変数の値または参照をリスナーに渡すかどうかを検討することが重要です。

あなたの場合、各リスナーが i の時点で意図された値ではなく最終的な値を使用しているという問題が発生しました。リスナーの作成。この問題は、JavaScript が var キーワードを使用した変数ホイスティングを使用しているために発生します。この場合、変数はスコープの先頭で宣言され、グローバル スコープが与えられます (ブロック内で宣言されている場合でも)。

これに対処するには、次のようにします。

let または const によるブロック スコープの使用:

最新のブラウザでは、let または const キーワードを利用してブロック スコープの変数を作成できます。これにより、変数が含まれるブロック内で宣言され、そのブロックの外からはアクセスできないことが保証されます。

for (let i = 0; i < results.length; i++) {
  let marker = results[i];
  google.maps.event.addListener(marker, 'click', () => change_selection(i));
}
ログイン後にコピー

匿名関数を使用したクロージャの作成:

ブロック スコープの変数はサポートされていないため、クロージャを作成して、反復ごとに i の現在の値を保存できます。これには、イベント リスナーの作成を匿名関数内にラップし、i をパラメーターとして渡すことが含まれます。

for (var i = 0; i < results.length; i++) {
  (function (i) {
    marker = results[i];
    google.maps.event.addListener(marker, 'click', function() {
      change_selection(i);
    });
  })(i);
}
ログイン後にコピー

i を最初の引数として匿名関数に渡すことで、実質的に i の値をリスナーへの関数呼び出しの時間。

以上が## イベント リスナーで変数値を保持する方法: 値渡しか参照渡しか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート