Bagaimana untuk Mengekalkan Nilai Pembolehubah dalam Pendengar Acara JavaScript: Pembolehubah atau Penutupan Skop Blok?

Cara Mengekalkan Nilai Pembolehubah dalam Pendengar Acara dalam JavaScript

Pertimbangkan coretan kod berikut:

<code class="javascript">for (var i = 0; i < results.length; i++) {
  marker = results[i];
  google.maps.event.addListener(marker, 'click', function() {
    change_selection(i);
  });
}

Dalam kod ini, nilai i yang digunakan dalam pendengar acara sentiasa nilai akhir keputusan. panjang selepas gelung ditamatkan. Untuk menyelesaikan isu ini, kita perlu menghantar nilai i kepada pendengar acara semasa penciptaannya.

Menggunakan Pembolehubah Skop Blok (ES6 dan Kemudian)

Dalam pelayar moden, kita boleh menggunakan pembolehubah berskop blok seperti let atau const. Pembolehubah ini hanya boleh diakses dalam blok yang ditakrifkan. Dengan menggunakan pembolehubah berskop blok, kami boleh memastikan bahawa nilai i pada masa penciptaan acara dikekalkan.

<code class="javascript">for (let i = 0; i < results.length; i++) {
  let marker = results[i];
  google.maps.event.addListener(marker, 'click', () => change_selection(i));
}</code>

Mencipta Penutupan (Pelayar Lama)

Dalam penyemak imbas lama yang tidak menyokong pembolehubah berskop blok, kita boleh membuat penutupan untuk mengekalkan nilai i. Penutupan ialah fungsi yang merangkum fungsi lain, mewujudkan skop bersarang. Dengan menghantar i sebagai hujah pertama kepada fungsi tanpa nama, kita boleh membuat penutupan yang mengekalkan nilai i.

<code class="javascript">for (var i = 0; i < results.length; i++) {
  (function (i) {
    marker = results[i];
    google.maps.event.addListener(marker, 'click', function() {
      change_selection(i);
    });
  })(i);
}</code>

Dengan menggunakan sama ada pembolehubah berskop blok atau teknik penutupan, kami boleh memastikan bahawa setiap pendengar acara menggunakan nilai i yang dimaksudkan.

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Nilai Pembolehubah dalam Pendengar Acara JavaScript: Pembolehubah atau Penutupan Skop Blok?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!