Rumah > hujung hadapan web > tutorial js > Cara Mengatasi Pencemaran Penutupan dalam Gelung: Panduan Praktikal

Cara Mengatasi Pencemaran Penutupan dalam Gelung: Panduan Praktikal

Mary-Kate Olsen
Lepaskan: 2024-10-16 17:50:02
asal
672 orang telah melayarinya

How to Overcome Closure Pollution in Loops: A Practical Guide

Penutupan Dalam Gelung: Panduan Praktikal untuk Menyelesaikan Pencemaran Penutupan

Dalam pengaturcaraan, penutupan memainkan peranan penting dalam menangkap pembolehubah dari skop luar. Walau bagaimanapun, apabila digunakan dalam gelung, ia boleh membawa kepada hasil yang tidak dijangka yang dikenali sebagai pencemaran penutupan. Artikel ini meneroka masalah ini dan menyediakan penyelesaian praktikal untuk menyelesaikannya.

Masalahnya

Pertimbangkan kod berikut:

<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>
Salin selepas log masuk

Malangnya, kod ini mengeluarkan:

<code>My value: 3
My value: 3
My value: 3</code>
Salin selepas log masuk

bukannya:

<code>My value: 0
My value: 1
My value: 2</code>
Salin selepas log masuk

Isunya

Masalah timbul kerana setiap fungsi yang diisytiharkan dalam gelung menangkap pembolehubah i yang sama dari skop luar. Apabila fungsi digunakan dalam gelung kedua, kesemuanya merujuk pada i yang sama, yang telah ditambah kepada 3 pada masa ia dilaksanakan.

Penyelesaian ES6: let

ES6 memperkenalkan kata kunci let, yang mencipta pembolehubah berskop blok. Menggunakan let dalam gelung memastikan setiap lelaran mempunyai pembolehubah i tersendiri, menyelesaikan isu pencemaran penutupan:

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

Penyelesaian ES5.1: forEach

Satu lagi penyelesaian untuk tatasusunan ialah menggunakan kaedah forEach:

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

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

Setiap lelaran gelung forEach mencipta penutupannya sendiri, menangkap elemen tatasusunan khusus untuk lelaran itu.

Klasik Penyelesaian: Penutupan

Penyelesaian klasik melibatkan pengikatan pembolehubah secara manual kepada nilai yang berasingan dan tidak berubah di luar fungsi:

<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>
Salin selepas log masuk

Dengan menghantar pembolehubah i sebagai hujah kepada bahagian dalam fungsi, kami membuat penutupan baharu untuk setiap lelaran, memastikan setiap fungsi merujuk nilai bebasnya sendiri.

Atas ialah kandungan terperinci Cara Mengatasi Pencemaran Penutupan dalam Gelung: Panduan Praktikal. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan