Pourquoi «for (var item in list)» avec les tableaux considérés comme une mauvaise pratique en JavaScript?

Question

Étant donné un tableau indexé numériquement basé sur zéro:

 var list = ['Foo', 'Bar', 'Baz'];
 

Plusieurs fois, j'ai remarqué que lorsque quelqu'un suggère de parcourir en boucle des variables dans un tableau comme celui-ci:

 for(var item in list) { ... }
 

... il y a presque certainement quelqu'un qui suggère que c'est une mauvaise pratique et suggère une approche alternative:

 var count = list.length;

for(var i = 0; i < count; i++) {
    var item = list[i];
    ...
}
 

Quel est le raisonnement pour ne pas utiliser la version simplifiée ci-dessus et pour utiliser le deuxième exemple à la place?

Answer 1

Tout d'abord, la commande de la boucle n'est pas défini pour un for...in boucle, donc il n'y a pas de garantir les propriétés de l'être réitéré dans l'ordre que vous voulez.

Deuxièmement, for...in itère sur tous les énumérable propriétés d'un objet, y compris ceux hérités de son prototype. Dans le cas des tableaux, cela pourrait nuire à vous, si votre code ou de toute bibliothèque de l'inclure dans votre page a augmenté le prototype de l' Array, ce qui peut être vraiment utile chose à faire:

Array.prototype.remove = function(val) {
    // Irrelevant implementation details
};

var a = ["a", "b", "c"];

for (var i in a) {
    console.log(i);
}

// Logs 0, 1, 2, "remove" (though not necessarily in that order)

Answer 2

Ajoutez list.foo = bar; et essayez d’utiliser des simples for . Si vous n'utilisez pas certaines bibliothèques (comme prototypeJs) et n'ajoutez aucune nouvelle propriété à un objet array - vous pouvez utiliser une simple instruction-for.