Expliquez cette demandeAnimationFrame idiom

Il y a beaucoup d'endroits (par exemple, comment utiliser requestAnimationFrame? ) window.requestAnimationFrame corrigent window.requestAnimationFrame comme ci-dessous. Je ne comprends pas pourquoi le côté droit de la tâche est enveloppé dans un appel de fonction.

 Window.requestAnimFrame = (function () {
     Retour window.requestAnimationFrame ||
     Window.webkitRequestAnimationFrame ||
     Window.mozRequestAnimationFrame ||
     Window.oRequestAnimationFrame ||
     Window.msRequestAnimationFrame ||
     Fonction (rappel) {
         Window.setTimeout (rappel, 1000/60);
     };
 }) ();

Je me suis déjà demandé la même chose. Je suis très sûr que Google aime vraiment les fermetures. Certes, il n'y a pas une seule variable, c'est une chose «sûre».

Pour autant que je puisse le dire, c'est exactement la même chose, sans aucun changement d'interférence avec les espaces de noms (une raison générale d'utiliser une fermeture comme ça):

 window.requestAnimFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback){ window.setTimeout(callback, 1000 / 60); }; 

Dans l'exemple OP, mettre le code dans la fermeture ne fait rien (au moins ce que je suis conscient 🙂

Regardez ici http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating pour une fonction similaire faisant la même chose avec une variable locale. Dans ce cas, la variable se terminerait globalement si elle n'était pas dans la fermeture.

Il y a donc deux choses impliquées:

  • Une fonction pour incorporer des variables afin qu'elles ne deviennent pas globales
  • En exécutant cette fonction immédiatement pour exécuter le code.

Ici, les fonctions immédiates JavaScript est une autre discussion sur ces fonctions immédiates .

Tout le meilleur, nobi

requestAnimationFrame prend un argument: la fonction à exécuter. Cependant, setTimeout prend la fonction à exécuter ainsi qu'un délai après lequel l'exécuter. Donc, alors que vous pouvez simplement affecter directement les fonctions individuelles, vous devez créer une fermeture pour setTimeout afin que vous puissiez attribuer le second argument.

C'est essentiellement une forme de curry .