Другие полезные методы массива

Другие полезные методы массива

Технический фундамент «дополнительных» методов

Эти методы решают точечные задачи нормализации структуры: выравнивание вложенности, инициализация, проверка типа и генерация массивов.

const nested = [1, [2, 3]];
const flat = nested.flat();
const generated = Array.from({ length: 3 }, (_, i) => i);

console.log(flat); // [1, 2, 3]
console.log(generated); // [0, 1, 2]

Ключевой момент: такие методы часто заменяют ручные циклы и делают преобразования короче и надежнее.

Разворачивание вложенности: flat

flat(depth) «расплющивает» вложенные массивы.

const nested = [1, [2, 3], [4, [5]]];

console.log(nested.flat()); // [1, 2, 3, 4, [5]]
console.log(nested.flat(2)); // [1, 2, 3, 4, 5]

Полезно, когда из API приходят данные с вложенными группами.

Сразу map + flat: flatMap

flatMap сначала применяет функцию к каждому элементу, потом делает flat(1).

const lines = ['a b', 'c d'];
const words = lines.flatMap((line) => line.split(' '));

console.log(words); // ['a', 'b', 'c', 'd']

Заполнение диапазона: fill

fill(value, start, end) заполняет массив значением в указанном диапазоне.

const cells = new Array(5).fill(0);
console.log(cells); // [0, 0, 0, 0, 0]

cells.fill(1, 1, 4);
console.log(cells); // [0, 1, 1, 1, 0]

Проверь себя: почему fill может неожиданно испортить данные, если вызвать его на исходном массиве?

Подсказка: потому что fill мутирует массив.

Еще одна частая ловушка: если заполнять массив объектом, то во всех ячейках будет одна и та же ссылка:

const rows = new Array(3).fill({ ok: true });
rows[0].ok = false;

console.log(rows); // [{ok:false}, {ok:false}, {ok:false}]

Проверка, что это массив: Array.isArray

console.log(Array.isArray([1, 2])); // true
console.log(Array.isArray('1,2')); // false
console.log(Array.isArray({ length: 2 })); // false

Это полезно при валидации входа с API.

Создание массива: Array.from

Array.from создает массив из итерируемого или массивоподобного значения.

console.log(Array.from('JS')); // ['J', 'S']
console.log(Array.from({ length: 3 }, (_, i) => i + 1)); // [1, 2, 3]

Микро-сценарии

  1. Развернуть вложенные категории товаров в один список.
  2. Создать заготовку массива для пагинации или сетки карточек.

Анти-провал: fill и flat могут менять ожидания по структуре данных, поэтому всегда проверяй результат console.log на тестовом примере.

Типичные ошибки

  • Ожидать, что flat() расплющит все уровни без указания depth.
  • Путать flatMap с обычным map.
  • Проверять массив через typeof, а не Array.isArray.
  • Использовать fill и забывать, что это мутация.

Краткий итог

  • flat уменьшает вложенность массива.
  • flatMap объединяет преобразование и одноуровневое «расплющивание».
  • fill заполняет диапазон массива значением.
  • Array.isArray надежно проверяет тип массива.
  • Array.from помогает создавать массивы из разных источников.