Menguasai JavaScript: Memahami panggilan, gunakan dan ikat.

WBOY
Lepaskan: 2024-08-13 14:32:32
asal
1008 orang telah melayarinya

Mastering JavaScript: Understanding call, apply, and bind.

JavaScript ialah bahasa pengaturcaraan serba boleh dan berkuasa yang membentuk tulang belakang pembangunan web moden. Apabila pembangun maju dalam perjalanan JavaScript mereka, mereka menghadapi konsep yang lebih maju yang boleh meningkatkan kemahiran pengekodan mereka dengan ketara. Antara konsep ini ialah kaedah panggilan, terap, dan ikatan. Kaedah ini adalah alat penting untuk memanipulasi konteks pelaksanaan fungsi dan mengurus kata kunci ini. Dalam artikel ini, kami akan meneroka kaedah ini secara mendalam, memahami perbezaannya dan mempelajari cara menggunakannya dengan berkesan dalam projek JavaScript anda.

Memahami Konteks Fungsi (ini)

Sebelum menyelam ke dalam panggilan, memohon dan mengikat, adalah penting untuk memahami konsep kata kunci ini dalam JavaScript

ini merujuk kepada objek yang sedang melaksanakan fungsi semasa. Nilai ini bergantung pada bagaimana fungsi dipanggil:

  • Dalam kaedah objek, ini merujuk kepada objek.
  • Dalam fungsi, ini merujuk kepada objek global (tetingkap dalam pelayar).
  • Dalam sesuatu acara, ini merujuk kepada elemen yang menerima acara tersebut.
  • Dalam mod ketat ("gunakan ketat";), ini tidak ditentukan dalam fungsi.

Namun, ada kalanya anda perlu menetapkan nilai ini secara manual. Di situlah panggilan, mohon dan ikat memainkan peranan.

Kaedah panggilan

Kaedah panggilan digunakan untuk memanggil fungsi dengan nilai tertentu ini dan hujah yang disediakan secara individu. Ini amat berguna apabila anda ingin meminjam kaedah daripada objek lain atau menetapkan konteks secara dinamik. Sintaksnya adalah seperti berikut:

function.call(thisArg, arg1, arg2, ...)
Salin selepas log masuk

Berikut ialah contoh untuk menggambarkan cara panggilan() berfungsi:

const person = { fullName: function(city, country) { console.log(this.firstName + " " + this.lastName + " lives in " + city + ", " + country); } }; const john = { firstName: "John", lastName: "Doe" }; person.fullName.call(john, "New York", "USA"); // Output: John Doe lives in New York, USA
Salin selepas log masuk

Dalam contoh ini, kami menggunakan call() untuk menggunakan fungsi Nama penuh dengan john sebagai nilai ini, dengan berkesan meminjam kaedah daripada objek orang.

Kaedah memohon

Kaedah apply() adalah serupa dengan call(), tetapi ia memerlukan argumen sebagai tatasusunan. Sintaksnya ialah:

function.apply(thisArg, [argsArray])
Salin selepas log masuk

Kita ambil contoh.

const person = { fullName: function(city, country) { console.log(this.firstName + " " + this.lastName + " lives in " + city + ", " + country); } }; const john = { firstName: "John", lastName: "Doe" }; person.fullName.apply(john, ["New York", "USA"]); // Output: John Doe lives in New York, USA
Salin selepas log masuk

Perbezaan utama antara call() dan apply() ialah cara mereka mengendalikan hujah. call() menjangkakan hujah akan dihantar secara individu, manakala apply() mengharapkannya dalam tatasusunan.

Kaedah mengikat

Tidak seperti call() dan apply(), yang serta-merta menggunakan fungsi tersebut, bind() mencipta fungsi baharu dengan nilai ini tetap. Ini amat berguna untuk mencipta fungsi yang boleh dipanggil kemudian dengan konteks tertentu. Sintaksnya ialah:

const boundFunction = function.bind(thisArg, arg1, arg2, ...)
Salin selepas log masuk

Berikut ialah contoh cara bind() berfungsi:

const person = { firstName: "John", lastName: "Doe", fullName: function() { return this.firstName + " " + this.lastName; } }; const logName = function() { console.log(this.fullName()); }; const boundLogName = logName.bind(person); boundLogName(); // Output: John Doe
Salin selepas log masuk

Dalam contoh ini, kami mencipta fungsi baharu boundLogName yang mempunyai orang terikat secara kekal sebagai nilai ini.

Perbandingan dan Kes Penggunaan

  • panggilan: Gunakan apabila anda perlu menggunakan fungsi dan mengawal konteks ini dengan segera, memberikan hujah secara individu.
  • apply: Sama seperti panggilan, tetapi gunakannya apabila anda mempunyai pelbagai hujah.
  • bind: Gunakan apabila anda perlu mencipta fungsi yang boleh dipanggil kemudian dengan konteks tertentu ini.

Pertimbangan Prestasi

Walaupun panggilan, mohon dan ikat adalah alat yang berkuasa, adalah penting untuk mempertimbangkan implikasi prestasinya. bind() biasanya lebih perlahan daripada call() atau apply() kerana ia mencipta fungsi baharu. Jika anda bekerja di bahagian kritikal prestasi kod anda, anda mungkin mahu menggunakan call() atau apply() dan bukannya bind().

Amalan Terbaik dan Perangkap Biasa

Apabila menggunakan panggilan, mohon dan ikat, ingatlah amalan terbaik ini:

  • Sentiasa jelas tentang perkara ini yang patut dirujuk dalam fungsi anda.
  • Gunakan call() atau apply() apabila anda mahu menggunakan fungsi dengan segera dengan nilai ini yang khusus.
  • Gunakan bind() apabila anda ingin mencipta fungsi baharu dengan nilai ini tetap untuk kegunaan kemudian.
  • Berhati-hati apabila menggunakan kaedah ini dengan fungsi anak panah, kerana fungsi anak panah mempunyai leksikal pengikatan ini yang tidak boleh diubah.

Perangkap biasa ialah terlupa bahawa bind() mengembalikan fungsi baharu. Pastikan sama ada anda menetapkan semula fungsi terikat atau menggunakannya secara terus

Kesimpulan

Menguasai panggilan, memohon dan mengikat adalah langkah penting ke arah menjadi pembangun JavaScript yang mahir. Kaedah ini menyediakan cara yang berkesan untuk mengawal konteks pelaksanaan fungsi dan mengurus kata kunci ini. Dengan memahami dan menggunakan alatan ini dengan berkesan, anda boleh menulis kod yang lebih fleksibel, boleh digunakan semula dan boleh diselenggara.

JavaScript の探索を続けるときは、これらの概念は氷山の一角にすぎないことを忘れないでください。言語は常に進化しており、最新の機能とベスト プラクティスを常に最新の状態に保つことが重要です。プロジェクトで呼び出し、適用、バインドの使用を練習すると、よりエレガントで効率的な JavaScript コードを記述できるようになります。

Atas ialah kandungan terperinci Menguasai JavaScript: Memahami panggilan, gunakan dan ikat.. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!