Problèmes de performances avec les instructions de boucle JavaScript

Dans la plupart des langages de programmation, les instructions de boucle consomment la plupart du temps
Et les instructions de boucle sont un modèle de programmation très important

Dans notre JavaScript, il existe quatre types de boucles

1. for loop

2. boucle while

3. boucle à faire pendant

4. boucle for-in

Les trois premières boucles sont également très courantes dans d'autres langues
La boucle for-in peut être nouvelle pour les étudiants qui ont étudié C/C à l'école
Elle recherchera des exemples et des propriétés de prototype, cela entraîne donc plus de surcharge par itération
La boucle for-in finit par être seulement 1/7 aussi rapide que les trois autres types
Donc, à moins que nous n'ayons explicitement besoin de parcourir un nombre inconnu d'objets de propriétés, sinon nous devrait essayer d'éviter d'utiliser for-in
, encore moins une boucle for-in pour parcourir le tableau

Nous pouvons itérer un objet clair comme celui-ci

var props = [&#39;prop1&#39;, &#39;prop2&#39;],      i = 0;while(i < props.length){
    fn(obj[props[i++]]);
}

De cette façon, il n'est pas nécessaire de rechercher chaque attribut de l'objet, ce qui réduit la surcharge de boucle

Si nous ne connaissons pas l'implémentation interne de l'objet
Nous avons toujours devons gérer les propriétés de l'objet lui-même, et nous ne pouvons le faire que

for(var prop in obj){    if(obj.hasOwnProperty(prop)){
        //...
    }
}

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

Pour pouvoir optimiser,

for(var i = 0, len = arr.length; i < len; i++){
    fn(arr[i]);
}

Il en va de même pour while, do-while
En fonction de la longueur du tableau, cela peut économiser environ 25 % du temps d'exécution dans de nombreux navigateurs

for(var i = items.length; i--;){
    process(items[i]);
}

var j = items.length;while(j--){
    process(items[j]);
}

var k = items.length - 1;do {
    process(items[k]);
}while(k--);

est réduit à un jugement (si c'est vrai), améliorant encore la vitesse de boucle

Nous avons peut-être tous utilisé des méthodes de tableau telles que arr.forEach() ou des méthodes d'itération de framework telles que $().each() de jQuery. Pour parcourir un tableau,
Ces méthodes exécutent une fonction sur chaque élément du tableau
Bien qu'elles soient pratiques, elles sont beaucoup plus lentes qu'une boucle normale (appelant une méthode externe)
Dans tous les cas, l'itération basée sur une boucle est environ 8 fois plus rapide qu'une itération basée sur une fonction
Donc nous essayons d'utiliser ces boucles ordinaires (for, while, do-while) lorsque nous pouvons résoudre le problème