Bagaimana untuk Mengekalkan Konteks dalam Panggilan Balik `setTimeout` JavaScript?

Memelihara Konteks apabila Menggunakan Panggilan Balik setTimeout

Apabila menggunakan setTimeout dalam JavaScript, menghantar konteks yang sesuai kepada fungsi panggil baliknya boleh menjadi penting. Sebagai contoh, katakan anda ingin memanggil kaedah this.tip.destroy() selepas 1000 milisaat, dengan syarat this.options.destroyOnHide adalah benar. Menggunakan kaedah ini, bagaimanapun, menghasilkan ini merujuk kepada objek tetingkap global.

Penyelesaian untuk Memelihara Konteks

Sepanjang evolusi JavaScript, pelbagai pendekatan telah muncul untuk menyelesaikan konteks ini isu:

• Konteks Mengikat (ES5): Kaedah bind(), yang diperkenalkan dalam ES5, membolehkan anda mencipta fungsi baharu dengan nilai ini yang dipratakrifkan, menghalang perkara global ini daripada merayap masuk:

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

• Fungsi Anak Panah (ES6): Fungsi anak panah memudahkan proses ini dengan menghapuskan konsep mereka sendiri nilai ini. Apabila mengakses ini dalam fungsi anak panah, ia mewarisi nilai skop sekelilingnya:

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

• Melalui Konteks sebagai Argumen (HTML5): HTML5 diperkenalkan pendekatan piawai yang melibatkan penghantaran konteks sebagai hujah kepada panggilan balik fungsi:

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

Dengan menggunakan salah satu daripada teknik ini, anda boleh mengekalkan konteks yang diingini dengan berkesan apabila menggunakan panggilan balik setTimeout, memastikan kod anda berfungsi seperti yang dijangkakan.

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