使用的setInterval

Question

的時候，我們有一個tick功能

tick() { 
    this.setState({ 
     date: new Date() 
    }); 
} 

我們爲什麼要使用類似，

componentDidMount() { 
    this.timerID = setInterval(() => this.tick(), 1000); 
} 

，而不只是簡單地

componentDidMount() { 
    this.timerID = setInterval(this.tick, 1000); 
} 

我想，我們有一些當我嘗試第二個變體時，關閉問題。但是，請你詳細解釋發生了什麼。

您可以找到代碼here的其餘部分。

Answer 1

原因傳遞

setInterval(this.tick,1000) 

行爲就像：

window.tick = this.tick; 
setInterval(window.tick,1000); 

所以此內部蜱是窗口，其中一個處理不當的setState方法。

---

現在真正的答案：

JavaScript中的上下文（又名這）當函數被調用時確定的。

a.b() // b called with context a 
c.d(); // d called with context c 
e();// e called with the default (window) context 

因此，作爲setInterval函數看起來是這樣的（實際上它在C寫的，但那是另一回事）：

​​

你將永遠失去通過setInterval的上下文。一個解決方法是要麼。綁定 ing或使用箭頭功能，它們總是採取他們的周圍環境（所以他們沒有任何鬆動;））