Почему использовать for...in для перебора массива — плохая идея?

Почему for...in не предназначен для массивов

Цикл for...in создан для перебора перечисляемых свойств объекта, включая унаследованные через прототип. Массив в JavaScript — это тоже объект, но его элементы хранятся как числовые ключи (0, 1, 2...). Однако есть несколько серьёзных проблем, из-за которых использовать его для массивов — плохая идея.

1. Порядок итерации не гарантирован

Спецификация ECMAScript не гарантирует, что for...in будет перебирать индексы в порядке возрастания. Хотя в современных браузерах это обычно работает корректно, полагаться на это нельзя. Например, если массив имеет «дыры» (пропущенные элементы), порядок может нарушиться:

const arr = [10, , 30]; // пропущен индекс 1
arr[5] = 60;

for (let key in arr) {
  console.log(key); // "0", "2", "5" — порядок может быть неожиданным!
}

2. Перебираются унаследованные свойства

for...in проходит по всем перечисляемым свойствам, включая те, что добавлены в прототип Array.prototype. Если кто-то расширил прототип массива (что делать не рекомендуется, но в старых библиотеках встречалось), вы получите лишние ключи:

Array.prototype.customMethod = function() {};

const colors = ['red', 'green', 'blue'];
for (let i in colors) {
  console.log(i); // "0", "1", "2", "customMethod" — лишнее свойство!
}

3. Ключи — строки, а не числа

Все ключи в for...in возвращаются как строки. Если вы попытаетесь выполнить арифметические операции с ними, могут возникнуть ошибки:

const nums = [1, 2, 3];
for (let i in nums) {
  console.log(i + 1); // "01", "11", "21" — строковая конкатенация, а не сложение!
}

4. Низкая производительность

Цикл for...in медленнее, чем обычный for или forEach, потому что движку нужно проверять всю цепочку прототипов на каждом шаге.

Что использовать вместо for...in?

• Классический for — самый быстрый и контролируемый:

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

• for...of (ES6) — современный и безопасный, перебирает только значения:

for (let value of arr) {
  console.log(value);
}

• forEach — декларативный метод с колбэком:

arr.forEach((value, index) => {
  console.log(index, value);
});

Когда for...in всё же уместен?

Только для перебора обычных объектов (не массивов), когда нужно получить все перечисляемые свойства, включая унаследованные. Но даже для объектов лучше использовать Object.keys() или Object.entries() в паре с for...of — это безопаснее и предсказуемее.

Вывод: for...in для массивов — это антипаттерн. Используйте специализированные инструменты, которые дают контроль над порядком, типом данных и производительностью.

const arr = [1, 2, 3];
Array.prototype.foo = 'bar';

for (let key in arr) {
  if (arr.hasOwnProperty(key)) {
    console.log(arr[key]); // только 1, 2, 3
  }
}