Вопрос с собеседования · Frontend

Какие методы массивов меняют исходный массив, а какие возвращают новый?

JuniorОсновы JavaScript
Ещё спрашивают так:
  • Чем map отличается от forEach?
  • Как работает reduce?
Коротко

Мутируют: push, pop, shift, unshift, splice, sort, reverse, fill. Возвращают новый: map, filter, slice, concat, flat, а с ES2023 — toSorted, toReversed, toSpliced, with. forEach ничего не возвращает — для побочных эффектов; map — для преобразования в новый массив.

  • reduce сворачивает массив в одно значение; без начального значения на пустом массиве — ошибка
  • sort по умолчанию сравнивает строки: [10, 9, 1].sort() → [1, 10, 9]
  • find, some, every, includes — для поиска и проверок

А ещё В React-состоянии нельзя sort и push — только неизменяющие методы

Подробно

Почему важна мутация. Если массив пришёл из props, состояния или общего модуля, мутирующий метод изменит его для всех. В React мутация не вызовет перерисовку: ссылка на массив прежняя.

sort без компаратора приводит элементы к строкам и сравнивает лексикографически. Числа — всегда (a, b) => a - b.

reduce с начальным значением безопасен на пустом массиве; без него первым аккумулятором становится первый элемент.

Цепочки filter().map() создают промежуточные массивы — на небольших данных это не важно, на больших можно заменить одним reduce или циклом.

Пример

const nums = [10, 9, 1];
nums.toSorted((a, b) => a - b);   // [1, 9, 10], nums не изменился
nums.sort();                       // [1, 10, 9] — строковое сравнение, мутация

const total = cart.reduce((sum, item) => sum + item.price * item.qty, 0);
const byId = Object.fromEntries(users.map(u => [u.id, u]));
const active = users.filter(u => u.active).map(u => u.email);

Что хотят услышать

  • Деление на мутирующие и нет.
  • map против forEach, reduce.
  • Ловушка sort.

Проверьте себя

Один верный вариант. Подумайте, потом откройте ответ.

Показать варианты и ответ
  • ✗map и filter изменяют исходный массив, а slice и concat возвращают новый
  • ✗sort и reverse возвращают новый массив, а push, splice и toSorted — мутируют исходный
  • ✗forEach возвращает новый преобразованный массив, а map только обходит элементы
  • ✓push, splice, sort, reverse мутируют; map, filter, slice, toSorted возвращают новый

Связанные вопросы

Партнёр платформы

Разбор собеседования с sotto

После собеседования sotto разбирает разговор: оценка, каждый вопрос — хорошо, частично или слабо, чего не хватило в ответе и над чем поработать к следующему разу. Первые 30 минут бесплатно.

Разбор собеседования