web-dev-qa-db-fra.com

Efficacité Javascript: 'pour' vs 'pourEach'

Quelle est la norme actuelle en 2017 en Javascript avec les boucles for () vs .forEach.

Je travaille actuellement sur "Web Dev Bootcamp" de Colt Steeles sur Udemy et il privilégie forEach par rapport à for dans ses enseignements. Cependant, j’ai cherché différentes choses au cours des exercices dans le cadre du cours et j’ai trouvé de plus en plus de recommandations pour utiliser une boucle for- plutôt que forEach. La plupart des gens semblent affirmer que la boucle est plus efficace.

Est-ce quelque chose qui a changé depuis la rédaction du cours (vers 2015) ou est-ce vraiment le pour et le contre de chacun, que l'on apprendra avec plus d'expérience.

Tout avis serait grandement apprécié.

javascriptloopsfor-loopforeach
74
tonyrobbins

for

Les boucles for sont beaucoup plus efficaces. C'est une construction en boucle spécialement conçue pour itérer lorsqu'une condition est true, offrant en même temps un mécanisme pas à pas (généralement pour augmenter l'itérateur). Exemple:

for (var i=0, n=arr.length; i < n; ++i ) {
   ...
}

Cela ne veut pas dire que les boucles pour - seront toujours plus efficaces, mais simplement que les moteurs et navigateurs JS les ont optimisées. Au fil des ans, il a été difficile de déterminer quelle construction de boucle est la plus efficace (pour, tandis que, réduire, inverser, etc.) - différents navigateurs et moteurs JS ont leurs propres implémentations qui offrent différentes méthodologies pour produire les mêmes résultats. Au fur et à mesure que les navigateurs optimisent pour répondre aux exigences de performances, [].forEach pourrait théoriquement être implémenté de manière à être plus rapide ou comparable à un for.

Avantages:

  • efficace
  • début de la boucle (honors break et continue)
  • contrôle de condition (i<n peut être n'importe quoi et n'est pas lié à la taille d'un tableau)
  • portée variable (var i laisse i disponible après la fin de la boucle)

pour chaque

.forEach sont des méthodes qui parcourent principalement des tableaux (ainsi que d'autres objets énumérables, tels que les objets Map et Set). Ils sont plus récents et fournissent un code subjectivement plus facile à lire. Exemple:

[].forEach((val, index)=>{
   ...
});

Avantages:

  • n'implique pas de configuration variable (itère sur chaque élément du tableau)
  • functions/arrow-functions étend la variable au bloc
    Dans l'exemple ci-dessus, val serait un paramètre de la fonction nouvellement créée. Ainsi, toutes les variables appelées val avant la boucle conserveraient leurs valeurs après la fin.
  • subjectivement plus facile à gérer, car il peut être plus facile d'identifier ce que fait le code - il effectue une itération sur un énumérable; alors qu'une boucle for pourrait être utilisée pour un nombre quelconque de schémas de bouclage

Performance

La performance est un sujet délicat, qui nécessite généralement une certaine expérience de la prévoyance ou de l’approche. Afin de déterminer à l'avance (tout en développant) combien d'optimisation peut être nécessaire, un programmeur doit avoir une bonne idée de l'expérience passée avec le cas de problème, ainsi qu'une bonne compréhension des solutions potentielles.

Utiliser jQuery dans certains cas peut parfois être trop lent (un développeur expérimenté peut le savoir), alors que d’autres peuvent ne pas être un problème, auquel cas la conformité de la bibliothèque à plusieurs navigateurs et la facilité d’exécuter d’autres fonctions (par exemple, AJAX, gestion des événements) mériterait un gain de temps en termes de développement (et de maintenance).

Un autre exemple est que si performance et optimisation étaient primordiales, il n'y aurait pas d'autre code que machine ou Assembly. Évidemment, ce n'est pas le cas, car il existe de nombreuses langues de haut niveau et de bas niveau, chacune avec leurs propres compromis. Ces compromis incluent, sans s'y limiter, la spécialisation, la facilité et la rapidité de développement, la facilité et la rapidité de maintenance, un code optimisé, un code sans erreur, etc.

Approche

Si vous ne comprenez pas très bien si quelque chose nécessitera un code optimisé, il est généralement préférable de commencer par écrire du code maintenable. À partir de là, vous pouvez tester et identifier ce qui nécessite plus d’attention lorsque cela est nécessaire.

Cela dit, certaines optimisations évidentes devraient faire partie de la pratique générale et ne nécessiter aucune réflexion. Par exemple, considérons la boucle suivante:

for (var i=0; i < arr.length; ++i ){}

Pour chaque itération de la boucle, JavaScript récupère le arr.length, opération de chiffrage de la recherche d'une clé à chaque cycle. Il n'y a aucune raison pour que cela ne soit pas:

for (var i=0, n=arr.length; i < n; ++i){}

Cela fait la même chose, mais récupère seulement arr.length une fois, en mettant en cache la variable et en optimisant votre code.

148
vol7ron