Bagaimana untuk Mengekalkan Konteks `ini` yang Betul dalam Panggilan Balik `setTimeout`?

Memastikan Konteks ini Betulkan dalam setTimeout Panggilan Balik

Apabila menggunakan setTimeout untuk menjadualkan fungsi panggil balik, adalah penting untuk memastikan fungsi itu mengekalkan konteks yang dikehendaki. Walau bagaimanapun, isu timbul apabila ini merujuk kepada objek global dalam panggilan balik.

Dalam contoh yang disediakan:

if (this.options.destroyOnHide) {
     setTimeout(function() { this.tip.destroy() }, 1000);
}

ini merujuk kepada tetingkap global, bukan objek yang dimaksudkan. Untuk mengelakkan ini, terdapat beberapa pendekatan:

1. Simpan Konteks:

Simpan rujukan kepada konteks semasa sebelum memanggil setTimeout.

var that = this;
if (this.options.destroyOnHide) {
     setTimeout(function(){ that.tip.destroy() }, 1000);
}

2. Gunakan Kaedah ikatan (ES5):

Buat fungsi baharu terikat pada konteks yang betul menggunakan bind.

if (this.options.destroyOnHide) {
     setTimeout(function() { this.tip.destroy() }.bind(this), 1000);
}

3. Gunakan Fungsi Anak Panah (ES6 ):

Fungsi anak panah secara automatik mewarisi nilai ini daripada leksikalnya skop.

if (this.options.destroyOnHide) {
     setTimeout(() => { this.tip.destroy() }, 1000);
}

4. Hantar Argumen ke Panggilan Balik (HTML5 ):

Pemasa HTML5 membenarkan menghantar argumen kepada panggilan balik.

if (this.options.destroyOnHide) {
     setTimeout(function(that){ that.tip.destroy() }, 1000, this);
}

Ingat bahawa konteks ini boleh berbeza-beza bergantung pada cara fungsi itu digunakan. Untuk memastikan tingkah laku yang diingini, pertimbangkan pendekatan yang sesuai berdasarkan ciri bahasa yang tersedia.

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Konteks `ini` yang Betul dalam Panggilan Balik `setTimeout`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!