Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Mengekalkan Skop `ini` Apabila Menggunakan Kaedah Contoh sebagai Panggilan Balik dalam JavaScript?

Bagaimana untuk Mengekalkan Skop `ini` Apabila Menggunakan Kaedah Contoh sebagai Panggilan Balik dalam JavaScript?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-11-06 19:54:03766semak imbas

How to Preserve `this` Scope When Using Instance Methods as Callbacks in JavaScript?

ini Teka-teki dalam Panggilan Balik JavaScript

Apabila menetapkan kaedah contoh sebagai pengendali acara, skop ini beralih daripada contoh objek kepada pemanggil acara. Ini boleh menimbulkan masalah dan memerlukan penggunaan penyelesaian seperti ini:

function MyObject() {
  this.doSomething = function() {
    ...
  }

  var self = this
  $('#foobar').bind('click', function(){
    self.doSomethng()
    // this.doSomething() would not work here
  })
}

Walaupun berfungsi, pendekatan ini mungkin kelihatan janggal. Adakah terdapat cara yang lebih baik?

Memahami Penutupan

Isu asas melangkaui jQuery, berakar umbi dalam gelagat penutupan dalam JavaScript. Penutupan membenarkan fungsi dalaman mengakses pembolehubah yang diisytiharkan dalam skop luarnya. Walau bagaimanapun, ini ialah pembolehubah khas yang boleh menukar skopnya secara dinamik.

Untuk menyalurkan ini ke dalam fungsi terbenam, seseorang boleh menetapkannya kepada alias, seperti abc:

var abc = this;

function xyz(){
  // "this" is different here! --- but we don't care!
  console.log(abc); // now it is the right object!
  function qwe(){
    // "this" is different here too! --- but we don't care!
    console.log(abc); // it is the right object here too!
  }
  ...
};

Ini membolehkan abc mengekalkan rujukan objek yang betul walaupun dalam fungsi terbenam.

Kesimpulan

Aliasing ini membolehkan penggunaan kaedah contoh yang cekap sebagai panggilan balik tanpa menjejaskan skop. Teknik ini digunakan bukan sahaja untuk ini tetapi juga untuk pembolehubah pseudo lain seperti argumen.

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Skop `ini` Apabila Menggunakan Kaedah Contoh sebagai Panggilan Balik dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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