Mengapa Gunakan `var that = this;` dalam JavaScript?

Memahami 'var that = this;' dalam JavaScript

Dalam JavaScript, kata kunci 'ini' mewakili objek semasa. Menetapkan 'ini' kepada 'var that' membolehkan pembangun mengekalkan rujukan kepada rujukan objek asal yang boleh diakses kemudian, walaupun dalam fungsi bersarang di mana 'ini' mungkin berubah.

Pertimbangkan coretan kod berikut:

function Somefunction(){
   var that = this; 
   ... 
}

Di sini, menetapkan 'ini' kepada 'itu' memastikan bahawa dalam skop 'Somefunction', 'itu' sentiasa merujuk kepada contoh objek asal. Ini berfaedah apabila bekerja dengan penutupan atau pengendali acara di mana rujukan 'ini' mungkin berubah selepas menggunakan fungsi bersarang.

Untuk menggambarkan, katakan anda mempunyai fungsi yang mendengar acara 'klik' pada elemen:

var colours = ['red', 'green', 'blue'];
document.getElementById('element').addEventListener('click', function() {
    // this is a reference to the element clicked on

    var that = this;

    colours.forEach(function() {
        // this is undefined
        // that is a reference to the element clicked on
    });
});

Dalam pengendali acara, 'ini' merujuk kepada elemen yang telah diklik, tetapi di dalam bahagian dalam 'untukSetiap' fungsi, 'ini' menjadi tidak ditentukan. Dengan menyalinkannya kepada 'itu', anda masih boleh mengakses rujukan asal kepada elemen yang diklik.

Kesimpulannya, 'var that = this;' memastikan bahawa rujukan yang konsisten kepada objek semasa dikekalkan, menjadikannya sangat berguna dalam pengendalian peristiwa atau senario penutupan di mana 'ini' boleh berubah secara dinamik. Walau bagaimanapun, pertimbangkan untuk menggunakan alias yang lebih deskriptif untuk kejelasan, seperti 'clickedEl' atau 'currentElement', untuk menjadikan niat kod lebih jelas.

Atas ialah kandungan terperinci Mengapa Gunakan `var that = this;` dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!