Cara menggunakan kaedah apply (?), Call (?), Dan bind (➰) dalam JavaScript

Dalam artikel ini, kita akan membincangkan kaedah menerapkan, memanggil, dan mengikat rantai prototaip fungsi. Mereka adalah beberapa konsep yang paling penting dan sering digunakan dalam JavaScript dan sangat berkaitan dengan kata kunci ini .

Oleh itu, untuk memahami maklumat dalam artikel ini, pertama anda harus mengetahui konsep dan penggunaan kata kunci ini . Sekiranya anda sudah biasa dengannya, anda boleh teruskan - jika tidak, anda boleh merujuk artikel ini di sini dan kemudian kembali ke sini.

Untuk mengetahui mengenai apply | call | bind kita juga perlu mengetahui tentang fungsi dalam JavaScript, dengan andaian anda sudah biasa dengan ini .

Fungsi

Pembina Fungsi mencipta objek Fungsi baru. Memanggil konstruktor secara langsung dapat membuat fungsi secara dinamik, yang dapat dilaksanakan dalam lingkup global.

Oleh kerana fungsi adalah objek dalam JavaScript, permintaannya dikendalikan oleh kaedah menerapkan, panggilan, dan mengikat .

Untuk memeriksa apakah fungsi adalah objek Fungsi, kita dapat menggunakan kod dalam cuplikan berikut, yang kembali benar.

Objek Fungsi global tidak mempunyai kaedah atau sifat tersendiri. Walau bagaimanapun, kerana ia adalah fungsi itu sendiri, ia mewarisi beberapa kaedah dan sifat melalui rantai prototaip dari Function.prototype. - MDN

Berikut adalah kaedah dalam rantai prototaip fungsi:

  • Function.prototype.apply ()
  • Function.prototype.bind ()
  • Function.prototype.call ()
  • Function.prototype.isGenerator ()
  • Function.prototype.toSource ()
  • Object.prototype.toSource
  • Function.prototype.toString ()
  • Object.prototype.toString

Kami prihatin dengan tiga yang pertama, jadi mari kita mulakan.

Memohon?

Yang dikenakan () kaedah adalah satu kaedah penting dalam prototaip fungsi dan digunakan untuk memanggil fungsi lain dengan syarat ini nilai kata kunci dan hujah-hujah yang diberikan dalam bentuk array atau pelbagai seperti objek.

Objek seperti array boleh merujuk kepada NodeList atau objek argumen di dalam fungsi.

Ini cara yang kita boleh memanggil mana-mana fungsi dan jelas menyatakan apa ini harus rujukan dalam fungsi memanggil.

Sintaks

Kembali

Ia mengembalikan hasil fungsi yang dipanggil oleh ini.

Penerangan

Yang memohon kaedah yang digunakan untuk membenarkan fungsi / objek yang dimiliki oleh objek x untuk dipanggil dan diberikan kepada objek y.

Contoh

1.

Seperti yang dapat dilihat dalam cuplikan yang diberikan, kita melihat bahawa ketika kita mendorong array ke dalam array yang lain, keseluruhan array diperlakukan sebagai satu elemen dan didorong ke dalam variabel array.

Tetapi bagaimana jika kita mahu elemen-elemen itu didorong secara berasingan dan bukan sebagai tatasusunan? Sudah tentu terdapat banyak cara untuk melakukannya, tetapi semasa kita belajar, mari gunakan:

Dalam contoh yang diberikan kita dapat melihat penggunaan menerapkan dalam menggabungkan dua tatasusunan yang diberikan. Array argumen adalah susunan elemen dan argumen ini menunjukkan pemboleh ubah larik. Unsur-unsur pelbagai unsur-unsur yang ditolak dengan Objek ( lokasi ) yang kepadanya ini adalahmenunjuk . Kami mendapat hasilnya sebagai elemen individu larik kedua yang ditolak ke larik yang mana ini ditunjukkan.

2.

Fungsi maks dalam JS digunakan untuk mencari elemen dengan nilai maksimum dari kumpulan elemen tertentu. Tetapi seperti yang dapat kita lihat dari coretan, jika nilainya dalam bentuk array, kita mendapatkan hasilnya sebagai NaN. Tentunya kita berbicara mengenai JavaScript sekali lagi, ada beberapa cara untuk melakukan ini, tetapi mari kita gunakan.

Sekarang apabila kita menggunakan menerapkan dan menggunakan fungsi Math.max (), kita mendapat hasilnya. Seperti yang kita ketahui, berlaku akan mengambil semua nilai di dalam larik sebagai argumen individu dan kemudian fungsi maks akan diterapkan pada mereka. Ini akan memberi kita nilai maksimum dalam array.

Perkara yang menarik untuk dinyatakan di sini adalah bahawa di tempat ini kita telah menggunakan null. Oleh kerana argumen yang diberikan adalah array nombor, walaupun ini diperkenalkan, ia akan menunjukkan array yang sama dan kita akan mendapat hasil yang sama. Oleh itu, dalam kes seperti ini, kita boleh menggunakan nol sebagai ganti . Ini menunjukkan kepada kita bahawa argumen ini dalam fungsi berlaku adalah argumen pilihan.

Panggil

Kaedah panggilan () digunakan untuk memanggil fungsi dengan yang diberikan ini dan argumen yang diberikan kepadanya secara individu.

Ini cara yang kita boleh memanggil mana-mana fungsi, jelas menyatakan rujukan yang ini perlu rujukan dalam fungsi memanggil.

Ini sangat mirip dengan penerapan, satu-satunya perbezaan yang berlaku mengambil argumen dalam bentuk array atau objek seperti array, dan di sini argumen diberikan secara individu.

Sintaks

Kembali

Hasil memanggil fungsi dengan thisnilai dan argumen yang ditentukan .

Penerangan

The panggilan kaedah yang digunakan untuk membenarkan fungsi / objek yang dimiliki oleh objek x untuk dipanggil dan diberikan kepada objek y.

Contoh

1.

Ini adalah contoh rantai konstruktor. Seperti yang kita lihat, dalam setiap fungsi konstruktor Produk dipanggil, dan menggunakan panggilan sifat objek Produk dirantai dengan objek Pizza dan Mainan, masing-masing.

Apabila contoh baru dibuat dari objek Pizza dan Toy, parameter disediakan sebagai nama, harga dan kategori. Kategori diterapkan dalam definisi saja, tetapi nama dan harga diterapkan menggunakan konstruktor berantai dari objek Produk, seperti yang ditentukan dan diterapkan dalam objek Produk. Dengan sedikit perubahan kita dapat memperoleh pewarisan.

2.

Dalam coretan di atas, kami menentukan fungsi yang disebut tidur. Ini terdiri daripada balasan larik yang terdiri daripada unsur-unsur yang menangani sifat menggunakan kata kunci ini . Mereka didefinisikan dalam objek yang terpisah di luar fungsi.

Fungsi tidur dipanggil dengan objek obj sebagai argumen. Seperti yang kita lihat, sifat-sifat obj masing-masing diatur dalam this.animal dan this.sleepDuration , dan kita mendapat ayat penuh sebagai output.

Bind➰

Kaedah bind () membuat fungsi baru yang, ketika dipanggil, thiskata kunci ditetapkan ke nilai yang disediakan, dengan urutan argumen yang diberikan sebelum yang disediakan ketika fungsi baru dipanggil. - MDN

Sintaks

Kembali

Bind mengembalikan salinan fungsi dengan ini dan argumen yang diberikan.

Penerangan

Yang mengikat fungsi adalah sama seperti panggilan fungsi, dengan perbezaan utama adalah bahawa pulangan mengikat fungsi baru manakala panggilan tidak.

Menurut spesifikasi ECMAScript 5, fungsi yang dikembalikan oleh bind adalah jenis objek fungsi eksotik khas (kerana mereka menyebutnya) yang disebut fungsi Bound (BF) . BF membungkus objek fungsi asal. Memanggil BF menjalankan fungsi terbungkus di dalamnya.

Contoh

1.

Dalam coretan di atas, kami telah menentukan pemboleh ubah x dan objek yang disebut modul. Ini juga mengandungi sifat yang disebut x dan harta lain yang nilainya sesuai adalah fungsi yang mengembalikan nilai x .

Apabila fungsi getX dipanggil, ia mengembalikan nilai x yang ditentukan di dalam objek dan bukan x dalam skop global.

Pemboleh ubah lain dinyatakan dalam skop global yang memanggil fungsi getX dari objek modul . Tetapi kerana pemboleh ubah berada dalam skop global, ini dalam getX menunjukkan x global dan oleh itu 9 dikembalikan.

Pemboleh ubah lain ditentukan yang memanggil fungsi sebelumnya tetapi kali ini mengikat fungsi tersebut dengan objek modul . Pengikatan ini mengembalikan nilai x di dalam objek. Oleh kerana mengikat, ini dalam mata fungsi untuk nilai x dalam objek dan bukan global x . Oleh itu kita mendapat 81 sebagai output

Kesimpulannya

Setelah kami mengetahui asas-asas kaedahnya, anda mungkin masih sedikit bingung mengapa terdapat 3 fungsi berbeza yang melakukan perkara yang hampir sama. Untuk memperjelas konsep ini, anda harus berlatih dengan situasi dan senario yang berbeza sehingga anda dapat belajar dengan lebih mendalam di mana dan bagaimana ia dapat digunakan. Mereka pasti akan menjadikan kod anda lebih bersih dan lebih hebat.

Sekiranya anda menyukai artikel ini, sila tepuk tangan? dan ikut? untuk lebih.