如何在 JavaScript 原型函數中保留「this」引用？

在JavaScript 原型函數中保留「this」引用

使用JavaScript 原型時的一個常見挑戰是在巢狀中保留「this ”引用功能。這在處理事件或回調時變得尤為重要。

用「bind()」保留「this」：

JavaScript的bind()方法允許我們建立保留原始函數的「this」引用的新函數。這可以用來確保巢狀函數內的“this”關鍵字始終引用所需的物件。

在提供的範例中：

MyClass.prototype.myfunc = function() {
  this.element.click(function() {
    // Use bind() to preserve "this"
    // ...
  }.bind(this));
};

這裡，我們使用bind()來建立一個新的點選事件處理程序，用於維護 MyClass 物件的「this」引用。這允許我們在事件處理程序中存取 MyClass 屬性，例如「this.myValue」。

用閉包保留「this」：

另一種方法保留「this」就是使用閉包。閉包是保留對其父作用域變數的存取權限的函數，即使在父作用域完成執行後也是如此。

在提供的範例中，我們可以使用閉包來保留「this」：

MyClass.prototype.doSomething = function() {
  var that = this; // Capture "this" in a closure

  this.elements.each(function() {
    // Use "that" to access the MyClass properties
    // ...
  });
};

在內部函數中，我們可以透過引用「that」來存取 MyClass 屬性。

避免全域變數：

通常建議避免使用全域變數來保留“this”，因為它可能導致全域命名空間的衝突和污染。

乾淨高效的解決方案：

使用bind()或閉包提供在JavaScript 原型函數中保留「this」的乾淨而有效的方法，而不違反設計原則或引入不必要的複雜性。

以上是如何在 JavaScript 原型函數中保留「this」引用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！