Bagaimanakah Saya Boleh Mengekalkan Pengikatan `this` dengan `$(this)` jQuery's Dalam Fungsi Anak Panah ES6?

Memelihara Leksikal Pengikatan Ini dengan jQuery $(this) dalam Fungsi Anak Panah ES6

Apabila bekerja dengan pengikatan klik jQuery, pembangun mungkin menghadapi masalah apabila cuba menggunakan fungsi anak panah ES6 dengan leksikal pengikatan ini. Ini kerana fungsi anak panah dalam ES6 mengikat ini secara leksikal, yang boleh membawa kepada tingkah laku yang tidak dijangka apabila menggunakan jQuery, yang menjangkakan penutupan dengan nilai ini yang berbeza.

Dalam contoh yang disediakan:

Fungsi anak panah mengikat ini secara leksikal, menyebabkan $(this) merujuk kepada objek Permainan dan bukannya elemen yang diklik. Untuk menyelesaikan isu ini, adalah perlu untuk menggunakan event.currentTarget dan bukannya $(this):

Ini memastikan $(this) merujuk dengan betul elemen yang diklik, kerana jQuery secara eksplisit menyediakan event.currentTarget kepada mengendalikan senario di mana nilai ini mungkin tidak konsisten.

Memahami Leksikal Ikatan dalam ES6

Fungsi anak panah ES6 mempunyai leksikal pengikatan ini, bermakna ia mewarisi nilai konteks sekelilingnya. Ini boleh menguntungkan dan mencabar, kerana ia boleh menghalang isu pengikatan yang tidak disengajakan tetapi juga memerlukan pertimbangan yang teliti apabila bekerja dengan panggilan balik.

Kesimpulan

Apabila menggunakan fungsi anak panah ES6 dengan pengikatan klik jQuery, adalah penting untuk mengambil kira leksikal pengikatan ini dan pertimbangkan untuk menggunakan event.currentTarget untuk mengakses secara eksplisit elemen yang diklik. Ini memastikan kefungsian yang betul dan menghalang tingkah laku yang tidak dijangka disebabkan oleh perubahan nilai ini.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengekalkan Pengikatan `this` dengan `$(this)` jQuery's Dalam Fungsi Anak Panah ES6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!