Bagaimana untuk Mengelakkan Isu Penutupan apabila Mengakses Pembolehubah Luaran dalam Fungsi Gelung?

Mengakses Pembolehubah Luaran dalam Penutupan Gelung

Dalam JavaScript, apabila mengakses pembolehubah di luar penutupan dari dalam gelung, anda mungkin menghadapi isu di mana nilai terakhir pembolehubah dikembalikan secara konsisten. Ini berlaku kerana pembolehubah berubah dengan setiap lelaran gelung dan penutupan menangkap nilai akhirnya.

Untuk menyelesaikan masalah ini, teknik penutupan boleh digunakan untuk merangkumi pembolehubah dalam gelung. Penutupan berikut mencipta fungsi yang mengembalikan fungsi lain yang merangkumi pembolehubah:

<code class="javascript">for (var i in this.items) {
    var item = this.items[i];
    $("#showcasenav").append("<li id=\"showcasebutton_" + item.id + "\"> <img src=\"/images/showcase/icon-" + item.id + ".png\" /></li>");
    $("#showcasebutton_" + item.id).click(
        (function (item) {
            return function () {
                alert(item.id);
                self.switchto(item.id);
            };
        })(item)
    );
}</code>

Dalam contoh ini, fungsi tanpa nama dicipta dalam gelung, merangkum item pembolehubah. Fungsi ini segera dipanggil dengan parameter item, menghasilkan penutupan di mana item diliputi dalam setiap pengendali klik.

Sebagai alternatif, jQuery menyediakan fungsi $.each(), yang memudahkan lelaran gelung dan menghapuskan keperluan untuk penutupan dalam senario ini:

<code class="javascript">$.each(this.items, function (i, item) {
    $("#showcasenav").append("<li id=\"showcasebutton_" + item.id + "\"> <img src=\"/images/showcase/icon-" + item.id + ".png\" /></li>");
    $("#showcasebutton_" + item.id).click(function () {
        alert(item.id);
        self.switchto(item.id);
    });
});</code>

Atas ialah kandungan terperinci Bagaimana untuk Mengelakkan Isu Penutupan apabila Mengakses Pembolehubah Luaran dalam Fungsi Gelung?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!