JavaScriptで配列を使った'for(var item in list)'がバッドプラクティスとされるのはなぜか？

質問

単純なゼロベースで数値添字の配列が与えられた。

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

何度も言いますが、誰かがこのように配列内の変数をループすることを提案すると、私はそれに気づきました。

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

...それは悪い習慣だと提案し、別のアプローチを提案する人がほぼ確実にいます。

var count = list.length;

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

上のシンプルなバージョンを使わず、2番目の例を使う理由は何でしょうか？

どのように解決するのですか？

まず、ループの順番が不定なのは for...in ループの順序は不定なので、プロパティが希望する順序で反復される保証はありません。

2つ目は for...in はオブジェクトのプロトタイプから継承されたものを含む、すべての列挙可能なプロパティに対して反復処理を行います。配列の場合、あなたのコードやページに含まれるライブラリが、プロトタイプの Array のプロトタイプを拡張している場合、影響を受ける可能性があります。

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)