首頁 > web前端 > js教程 > JavaScript 函數呼叫和回呼中的「this」如何運作?

JavaScript 函數呼叫和回呼中的「this」如何運作?

DDD
發布: 2024-11-03 15:42:30
原創
393 人瀏覽過

How Does `this` Work in JavaScript Function Calls and Callbacks?

何時在JavaScript 中設定This 指標

理解函數呼叫中的This 指標

在JavaScript 中,每Java個函數呼叫都會設定對此的新值。 this 的值由呼叫函數的方法決定。

設定this 指標的主要方法

設定this 指標主要有六種方法在JavaScript 中:

  • 普通函數呼叫: 預設為全域物件(例如,視窗)或未定義(嚴格模式下)。
  • 方法Call: 指向擁有此方法的物件。
  • **.apply() 或 .call():根據傳遞的參數設定此值。
  • 使用 new : 建立一個新物件並將 this 設為它。
  • **.bind():傳回一個具有自訂 this 值的新函數,內部使用 .apply()。
  • ES6 胖箭頭函數: 綁定目前詞法 this 值(無法覆寫)。

回呼函數中的 This

回呼函數並不是設定這個的獨特方法。呼叫函數在呼叫回調時確定 this 值。

範例分析

在您的程式碼片段中:

<code class="javascript">var randomFunction = function(callback) {
  var data = 10;
  callback(data);
};

var obj = {
  initialData: 20,
  sumData: function(data) {
    var sum = this.initialData + data;
    console.log(sum);
  },
  prepareRandomFunction: function() {
    randomFunction(this.sumData.bind(this));
  }
};

obj.prepareRandomFunction();</code>
登入後複製
  • obj.prepareRandomFunction() 使用方法呼叫,將thisj.prepareRandomFunction() 使用方法呼叫設定為obj.
  • randomFunction(this.sumData.bind(this)) 使用.bind(),它將目前的this 值(即obj)綁定到回呼函數傳回。

因此,當 randomFunction 呼叫回調時,由於 this.sumData.bind(this) 中使用了 .bind(),this 被設定為 obj。

以上是JavaScript 函數呼叫和回呼中的「this」如何運作?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板