setInterval函数没有箭头功能

Question

我正在学习文档https://facebook.github.io/react/docs/state-and-lifecycle.html之后的反应组件

为什么我们需要在这里使用箭头功能:

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

为什么我不能说(显然它不起作用)

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

Answer 1

第一个参数setInterval是类型function.如果你这样写:

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

...然后你不传递函数,而是this.tick立即执行函数,然后将该函数调用返回的值作为参数传递.

你可以像这样写:

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

如果省略括号,则传递对this.tick函数的引用,然后setInterval在1000毫秒后执行.

Answer 2

setInterval 将函数作为第一个参数,在第二种情况下,它获取返回的值

将其更改为

this.timerID = setInterval(this.tick.bind(this), 1000);

要么

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

当您想要将函数绑定到React上下文时,这可能就是您所需要的.

请参阅此答案,了解您需要在React中绑定函数的原因

如果你不这样做,你可以简单地写

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