「=>」函數是否會丟失上下文？

我有用作（基因敲除）訂閱處理程序ES6「箭頭」功能：「=>」函數是否會丟失上下文？

this.foo = 'test' 
callback =() => console.log(this.foo) 
bar.subscribe(callback);

根據MDN：

箭頭功能捕獲封閉的上下文的這個值

，所以我期望的是，當callback被調用，它會記錄'test'。它並沒有。當我把一個調試器，我可以看到this實際上是一個ko.subscription（這當然不具有foo屬性）。

我可以通過手動綁定回調修復的東西：

callback = callback.bind(this)

，但我瞭解的事情，因爲我this前應callback曾經得到了subscribe已綁定不應該是必要的。

是否有人可以解釋我不理解有關新=>運營商，當它/不保留背景？

來源

2016-02-22 machineghost

您是否在瀏覽器或Babel或..中直接使用ES6？ – Matt

第一位代碼的上下文是什麼？喜歡，它在哪裏？在某個方法中？ – Pointy

@Matt直接在瀏覽器中（我將使用Babel進行製作，但在Babel甚至涉及到之前，我在Chrome的開發環境中看到了這一點）。 – machineghost

首先，感謝大家的幫助。事實證明，這只是某種棘手的Chrome開發人員工具錯誤。

這裏是我的原始（未simpified）代碼：

this.snapshot_profile = ko.observable('1'); 
this.foo = 5; 
this.snapshot_profile.subscribe((value) => { 
    console.log(this.foo); 
    debugger 
    // rest of the method 
});

事實證明，該console.log將返回正確5。但是，如果您在調試器線上暫停並將鼠標懸停在this上，您將看到它不是我班的實例，而是ko.subscription。如果我在控制檯「考察」 this，它看起來就像這樣：

callback: (value) 
dispose:() 
disposeCallback:() 
target: observable() 
__proto__: ko.subscription

不像我的類的實例。然而（奇怪的是）console.log行會正確記錄5。

上述所有可以「固定」通過結合的功能，或者直接或者通過基因敲除的裝訂機構。這讓我很困惑：在調試器綁定/不綁定箭頭函數實際上確實改變了事情！

但是，它看起來像它真的沒有改變什麼有意義的;它只是暴露了Chrome調試器中的一個錯誤。

來源

2016-02-23 01:40:42 machineghost

你報告了嗎？你可以鏈接它嗎？ – Bergi

Complications。如果ko綁定你的箭頭函數，調試器可能會報告綁定函數的'this'，但綁定一個胖箭頭函數應該對其實例具有* no *影響這個值（綁定返回一個新的包裝函數，箭頭函數首先應該像一個綁定函數一樣）。綁定一個箭頭函數，其內部有任何*效果，這個值聽起來像是一個瀏覽器錯誤。 – traktor53

「=>」函數是否會丟失上下文？

回答

相關問題