Rumah > hujung hadapan web > tutorial js > `bind()`, `call()` dan `apply()` Javascript: Bilakah Saya Perlu Menggunakan Setiap?

`bind()`, `call()` dan `apply()` Javascript: Bilakah Saya Perlu Menggunakan Setiap?

DDD
Lepaskan: 2024-12-02 01:37:10
asal
125 orang telah melayarinya

Javascript's `bind()`, `call()`, and `apply()`: When Should I Use Each?

Javascript's bind() vs call() dan apply(): Bila Perlu Menggunakan Setiap?

Semasa memanggil() dan memohon() kedua-duanya digunakan untuk memanggil fungsi dalam konteks tertentu (dengan menetapkan kata kunci ini dalam fungsi), perbezaan utamanya terletak pada cara hujah dihantar ke fungsi. call() menjangkakan argumen akan dihantar dalam senarai yang dipisahkan koma, manakala apply() memerlukan tatasusunan argumen.

Menggunakan Kaedah bind()

Tidak seperti call() dan apply(), bind() tidak menggunakan fungsi serta-merta. Sebaliknya, ia mengembalikan fungsi terikat baharu yang, apabila digunakan kemudian, akan mempunyai set konteks yang betul untuk memanggil fungsi asal. Ini amat berguna dalam situasi di mana anda ingin mengekalkan konteks dalam panggilan balik atau peristiwa tak segerak.

Sebagai contoh, pertimbangkan kod berikut:

function MyObject(element) {
    this.elm = element;

    element.addEventListener('click', this.onClick.bind(this), false);
};

MyObject.prototype.onClick = function(e) {
     var t=this;  //do something with [t]...
    //without bind the context of this function wouldn't be a MyObject
    //instance as you would normally expect.
};
Salin selepas log masuk

Dalam pengendali onClick, kata kunci ini akan merujuk kepada contoh MyObject yang mencipta pendengar acara, walaupun acara sedang dicetuskan secara tidak segerak.

Bila Menggunakan Panggilan/Apply vs. Bind

Gunakan call() atau apply() apabila anda perlu menggunakan fungsi dengan segera dan mengubah suai konteksnya. Sebaliknya, gunakan bind() apabila anda mahu fungsi itu boleh dipanggil kemudian dengan konteks tertentu, seperti dalam acara.

Berikut ialah ilustrasi mudah:

var obj = {
  x: 81,
  getX: function() {
    return this.x;
  }
};

alert(obj.getX.bind(obj)()); // 81
alert(obj.getX.call(obj));   // 81
alert(obj.getX.apply(obj));  // 81
Salin selepas log masuk

Dalam ketiga-tiga senario , output ialah 81, kerana semua fungsi akan menggunakan fungsi getX dalam konteks obj. Walau bagaimanapun, versi bind() mengembalikan fungsi baharu yang, apabila dilaksanakan, akan mempunyai set konteks yang diingini.

Atas ialah kandungan terperinci `bind()`, `call()` dan `apply()` Javascript: Bilakah Saya Perlu Menggunakan Setiap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan