Analisis singkat tentang penggunaan dan implementasi metode Bind () dalam JavaScript

Sebelum membahas metode Bind (), mari kita lihat pertanyaan:

var altwrite = document.write;

altwrite ("halo");

// 1. Apa masalah dengan kode di atas?

// 2. Seperti apa operasi yang benar

// 3. Cara mengimplementasikan metode bind ()

Untuk pertanyaan di atas, jawabannya tidak terlalu sulit. Titik uji utama adalah masalah yang ditunjukkan oleh ini. Fungsi altwrite () mengubah menunjuk ke objek global atau jendela, menyebabkan panggilan abnormal selama eksekusi. Solusi yang benar adalah menggunakan metode bind ():

altwrite.bind (dokumen) ("halo")

Tentu saja, Anda juga dapat menggunakan metode panggilan ():

altwrite.call (dokumen, "halo")

Fokus artikel ini adalah untuk membahas implementasi metode Bind () dalam edisi ketiga. Sebelum kita mulai membahas implementasi Bind (), mari kita lihat penggunaan metode Bind ():

Fungsi ikatan

Cara termudah untuk menggunakan bind () adalah dengan membuat fungsi sehingga fungsi memiliki nilai yang sama tidak peduli bagaimana itu disebut. Kesalahan umum seperti contoh di atas, mengeluarkan metode dari objek, lalu menyebutnya, dan ingin ini menunjuk ke objek asli. Jika tidak ada perlakuan khusus yang dilakukan, objek asli umumnya akan hilang. Menggunakan metode bind () dapat menyelesaikan masalah ini dengan indah:

 this.num = 9; var myModule = {num: 81, getNum: function () {return this.num; }}; module.getnum (); // 81var getNum = module.getnum; getNum (); // 9, karena dalam contoh ini, "ini" menunjuk ke objek global // Buat fungsi yang terikat pada modul var boundgetnum = getnum.bind (modul); BoundGetNum (); // 81

Fungsi parsial

Fungsi parsial juga disebut aplikasi parsial. Berikut adalah bagian dari definisi tentang fungsi parsial:

Aplikasi parsial dapat digambarkan sebagai fungsi yang menerima sejumlah argumen, mengikat nilai ke satu atau lebih dari argumen tersebut, dan mengembalikan fungsi baru yang hanya menerima argumen yang tersisa, tidak terikat.

Ini adalah fitur yang bagus. Menggunakan Bind () Kami mengatur parameter fungsi yang telah ditentukan, dan kemudian meneruskan parameter lain saat memanggil:

 daftar fungsi () {return array.prototype.slice.call (argumen);} var list1 = daftar (1, 2, 3); // [1, 2, 3] // Parameter yang telah ditentukan 37var leadingtHoTysevenList = list.bind (tidak ditentukan, 37); var list2 = leadingtHoTysevenList (); // [37] var list3 = leadingtHoTysevenlist (1, 2, 3); // [37, 1, 2, 3]

Gunakan dengan SetTimeout

Secara umum, penyelesaian ini () menunjuk ke jendela atau objek global. Saat menggunakan metode kelas, ini perlu menunjuk ke instance kelas, Anda dapat menggunakan bind () untuk mengikat ini ke fungsi callback untuk mengelola instance.

 function bloomer () {this.petalcount = math.ceil (math.random () * 12) + 1;} // Panggil fungsi deklarasi bloomer.prototype.bloom = function () {window.setTimeout (this.declare.bind (this), 1000);}; bloomer.protype. this.petalcount + 'Petal!');};

Catatan: Metode di atas juga dapat digunakan untuk fungsi penanganan acara dan metode setInterval.

Mengikat fungsi sebagai konstruktor

Fungsi BIND juga cocok untuk menggunakan operator baru untuk membangun contoh fungsi objektif. Saat menggunakan fungsi pengikatan untuk membangun sebuah instance, Catatan: Ini akan diabaikan, tetapi parameter yang diteruskan masih tersedia.

 titik fungsi (x, y) {this.x = x; this.y = y;} point.prototype.toString = function () {return this.x + ',' + this.y; }; var p = titik baru (1, 2); p.tostring (); // '1,2'var emplemtObj = {}; var yaxispoint = point.bind (emplemtobj, 0/*x*/); // Contoh dalam implementasi tidak didukung, // dukungan ikatan asli: var yaxispoint = point.bind (null, 0/*x*/); var axispoint = yaxispoint baru (5); axispoint.tostring (); // '0,5'axispoint dari titik; // contoh aksis dari yaxispoint; // Poin Baru True (17, 42) Instance dari Yaxispoint; // BENAR

Dalam contoh di atas, point dan yaxispoint berbagi prototipe, jadi memang benar ketika dinilai menggunakan instance dari operator.

jalan pintas

Bind () juga dapat membuat pintasan untuk fungsi yang membutuhkan nilai spesifik ini.

Misalnya, untuk mengubah objek array dari suatu kelas menjadi array nyata, contoh yang mungkin adalah sebagai berikut:

 var slice = array.prototype.slice; // ... slice.call (argumen);

Jika Anda menggunakan bind (), situasinya menjadi lebih mudah:

 var unboundslice = array.prototype.slice; var slice = function.prototype.call.bind (unboundslice); // ... slice (argumen);

menyelesaikan

Pada bagian di atas, Anda dapat melihat bahwa Bind () memiliki banyak skenario penggunaan, tetapi fungsi Bind () ditambahkan dalam versi kelima ECMA-262; Ini mungkin tidak berjalan di semua browser. Ini mengharuskan kita untuk mengimplementasikan fungsi bind () sendiri.

Pertama, kita dapat dengan mudah mengimplementasikan metode Bind () dengan menentukan ruang lingkup untuk fungsi objektif:

 Function.prototype.bind = function (konteks) {self = this; // Simpan ini, yaitu fungsi objektif yang menyebut metode BIND Returns function () {return self.Apply (konteks, argumen); };};

Mempertimbangkan kari fungsi, kita dapat membangun ikatan yang lebih kuat ():

 Function.prototype.bind = function (konteks) {var args = array.prototype.slice.call (argumen, 1), self = this; return function () {var innerArgs = array.prototype.slice.call (argumen); var finalArgs = args.concat (innerargs); return self.Apply (konteks, finalArgs); };};

Kali ini metode Bind () dapat mengikat objek dan juga mendukung parameter yang lewat selama pengikatan.

Lanjutkan, fungsi JavaScript juga dapat digunakan sebagai konstruktor. Ketika fungsi terikat dipanggil dengan cara ini, situasinya lebih halus, dan perlu terlibat dalam lewatnya rantai prototipe:

 Function.prototype.bind = function (konteks) {var args = array.prototype.slice (argumen, 1), f = fungsi () {}, self = this, ikat = fungsi () {var innerargs = array.prototype.slice.call (argumen); var finalArgs = args.concat (innerargs); return self.Apply ((instance f? This: Context), finalArgs); }; F.prototype = self.prototype; bound.prototype = baru f (); return terikat;};

Ini adalah implementasi Bind () dalam buku "Aplikasi Web JavaScript": Dengan mengatur konstruktor relai F, fungsi terikat berada pada rantai prototipe yang sama dengan fungsi panggilan BIND (). Gunakan operator baru untuk memanggil fungsi terikat, dan objek yang dikembalikan juga dapat menggunakan instance dari secara normal. Oleh karena itu, ini adalah implementasi Bind () yang paling ketat.

Untuk mendukung fungsi Bind () di browser, Anda hanya perlu memodifikasi fungsi di atas sedikit:

 Function.prototype.bind = function (othis) {if (typeof ini! == "function") {throw new typeError ("function.prototype.bind - Apa yang mencoba terikat tidak dapat dipanggil"); } var aargs = array.prototype.slice.call (argumen, 1), ftobind = this, fnop = function () {}, fbound = function () {return ftobind.Apply (instance dari fnop && othis? Ini: othis || window, aargs.cat) (othot. }; fnop.prototype = this.prototype; fbound.prototype = fnop baru (); kembali fbound; };

Analisis singkat di atas tentang penggunaan dan implementasi metode Bind () dalam JavaScript adalah semua konten yang saya bagikan dengan Anda. Saya harap ini dapat memberi Anda referensi dan saya harap Anda dapat mendukung wulin.com lebih lanjut.