為什麼「bind()」不能與箭頭函數「this」一起使用？

在箭頭函數中綁定「this」的難題：揭開困境

儘管箭頭函數具有誘人的簡單性，但它們關於'這讓很多開發者感到困惑。無法將「this」綁定到箭頭函數中的特定上下文已成為反覆出現的挫敗感來源。

為了說明這一困境，請考慮以下程式碼：

const f = () => console.log(this);

const o = { a: 42 };

const fBound = f.bind(o);

fBound(); // Expected: { a: 42 }, Actual: { window: Window }

在此範例中，我們嘗試使用“bind()”方法將箭頭函數“f”的“this”上下文綁定到物件“o”。然而，呼叫“fBound()”會莫名其妙地記錄全域“window”對象，而不是預期的“o”對象。

這種令人困惑的行為根源於箭頭函數的固有性質。與具有自己的“this”上下文的常規函數不同，箭頭函數從周圍的詞法範圍繼承其“this”綁定。在本例中，「f」是在全域範圍內定義的，將「this」呈現為綁定到全域「window」物件。

ECMAScript 2015 規格明確指出：

「任何引用ArrowFunction 中的參數、super、this 或new.target 必須解析為詞法封閉的綁定環境。」

因此，在箭頭函數中重新綁定“this”是不可能的。 「this」將永遠錨定在定義箭頭函數的上下文中。

如果「this」的有意義使用對您的程式碼至關重要，那麼謹慎的做法在於使用常規函數而不是使用常規函數箭頭函數。常規函數可以更好地控制“this”綁定，使您能夠使用“bind()”或其他方法將“this”明確綁定到所需的上下文。

以上是為什麼「bind()」不能與箭頭函數「this」一起使用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！