fonction setInterval sans fonction de flèche

Question

J'apprends à propos réagir composants après la documentation https://facebook.github.io/react/docs/state-and-lifecycle.html

Pourquoi avons-nous besoin d'utiliser la fonction de flèche ici:

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

Pourquoi ne puis-je dire (évidemment il doesn « t travail)

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

Answer 1

setInterval prend fonction en tant que premier argument, dans le second cas, il se fait une valeur retournée

Modifier à

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

ou

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

qui est probablement ce que vous avez besoin quand vous voulez lier la fonction au contexte React.

Voir cette réponse sur why you need to bind functions in React

Si vous ne vous auriez pu simplement écrit

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

Answer 2

Le premier argument pour setInterval est de type function. Si vous écrivez ceci:

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

... alors vous ne passez pas une fonction, au lieu d'exécuter la fonction this.tick immédiatement et passez ensuite la valeur renvoyée par cet appel de fonction comme argument.

Vous pourrait écrire comme ceci:

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

Si vous omettez les parenthèses, vous passez une référence à votre fonction this.tick, qui est ensuite exécuté par setInterval après 1000 millisecondes.

Answer 3

Vous devez fournir une référence de fonction, vous essayez d'appeler une fonction, à moins que cette fonction retourne une référence de fonction, votre code ne fonctionnera pas

Il devrait ressembler si

this.tick = function() { .... } 

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

Answer 4

Si vous ne l'utilisez la fonction de flèche alors votre code devrait ressembler à ceci:

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