Bagaimana untuk mengalih keluar Pendengar Acara dari Dalam Takrifnya Sendiri dalam JavaScript?

Mengalih keluar Pendengar Acara dalam JavaScript

Dalam JavaScript, pendengar acara biasanya digunakan untuk bertindak balas terhadap interaksi pengguna. Walau bagaimanapun, mungkin terdapat keadaan apabila anda perlu mengalih keluar pendengar ini atas pelbagai sebab.

Masalah:

Anda ingin mengalih keluar pendengar acara dari dalam takrifan pendengar itu sendiri. Walau bagaimanapun, percubaan untuk menggunakan 'ini' dalam pendengar mengakibatkan ralat.

Penyelesaian 1: Fungsi Dinamakan

Untuk mengatasi masalah ini, gunakan fungsi bernama dan bukannya fungsi tanpa nama :

var click_count = 0;

function myClick(event) {
    click_count++;
    if (click_count == 50) {
        // Remove the event listener
        canvas.removeEventListener('click', myClick);
    }
}

// Add the event listener
canvas.addEventListener('click', myClick);

Dalam penyelesaian ini, pembolehubah 'click_count' ditakrifkan di luar pendengar, memastikan keterlihatannya dalam fungsi. Selain itu, 'myClick' ialah fungsi bernama, yang membolehkannya dialih keluar kemudian.

Penyelesaian 2: Penutupan

Sebagai alternatif, anda boleh menggunakan penutupan untuk mencapai perkara ini:

var myClick = (function (click_count) {
    var handler = function (event) {
        click_count++;
        if (click_count == 50) {
            // Remove the event listener
            canvas.removeEventListener('click', handler);
        }
    };
    return handler;
})(0);

// Add the event listener
canvas.addEventListener('click', myClick);

Dalam pendekatan ini, penutupan dibuat di sekitar pembolehubah 'click_count'. Fungsi 'pengendali' menambah pembilang dan mengalih keluar pendengar acara jika perlu.

Penyelesaian 3: Pembilang Individu

Jika setiap elemen memerlukan pembilangnya sendiri, gunakan penyelesaian ini :

var myClick = function (click_count) {
    var handler = function (event) {
        click_count++;
        if (click_count == 50) {
            // Remove the event listener
            canvas.removeEventListener('click', handler);
        }
    };
    return handler;
};

// Add the event listener with a unique click counter for each element
canvas.addEventListener('click', myClick(0));

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar Pendengar Acara dari Dalam Takrifnya Sendiri dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!