箭頭函數和 'this'
在 ES6 中，箭頭函數引入了一種新的方法定義方式。然而，在存取“this”關鍵字時，箭頭函數和傳統函數之間存在顯著差異。
問題：
考慮以下程式碼：
var person = {
name: "jason",
shout: () => console.log("my name is ", this.name)
}
person.shout() // Should print out my name is jason雖然預期的結果是列印“我的名字是傑森”，但控制權台只輸出「我的名字是。」這是因為箭頭函數在「this」綁定方面與傳統函數的行為不同。
說明：
與傳統函數不同，箭頭函數不會綁定 ' this' 關鍵字到包含範圍。相反，它們從周圍的上下文繼承“this”綁定。上例中，箭頭函數中的「this」指的是全域對象，而不是「person」物件。
解：
有幾種解決此問題的方法：
// Bind 'this' to the 'person' object
var shoutBound = function() { console.log("my name is ", this.name); }.bind(person);
// Assign the bound function to the 'shout' property
person.shout = shoutBound;// Define a traditional function with 'this' bound to 'person'
person.shout = function() { console.log("my name is ", this.name); };// ES6 method declaration implicitly binds 'this' to the object
person = {
name: "jason",
shout() {
console.log("my name is ", this.name);
}
};透過了解箭頭函數關於'this' 綁定的不同行為，您可以在 ES6 中編寫有效且靈活的程式碼。
以上是箭頭函數如何處理 JavaScript 中的「this」關鍵字？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
