Что всегда возвращает метод `map` в JavaScript?

«Что всегда возвращает метод `map` в JavaScript?» — вопрос из категории JavaScript, который задают на 24% собеседований AQA / Automation. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Метод Array.prototype.map() всегда возвращает новый массив. Длина нового массива всегда равна длине исходного массива. Каждый элемент нового массива — это результат вызова предоставленной callback-функции на соответствующем элементе исходного массива.

Базовый пример:

const numbers = [1, 2, 3];
const squares = numbers.map(num => num * num);
console.log(squares); // [1, 4, 9]
console.log(numbers); // [1, 2, 3] (исходный массив не изменён)

Ключевые аспекты для тестирования:

  1. Возврат нового массива: Это важно для иммутабельности. Исходные данные не должны мутировать.

    // ПЛОХО: Мутация исходного массива внутри map (запутывает логику).
    const users = [{ age: 25 }, { age: 30 }];
    const ages = users.map(user => {
      user.age += 1; // Побочный эффект! Меняет исходный объект.
      return user.age;
    });
    console.log(users); // [{ age: 26 }, { age: 31 }] - Изменилось!
    
    // ХОРОШО: Создание нового объекта без мутаций.
    const updatedAges = users.map(user => user.age + 1);
  2. Обработка undefined: Если callback-функция ничего не возвращает, массив заполнится undefined.

    const arr = [1, 2];
    const result = arr.map(item => {
      console.log(item); // Действие есть, возврата нет.
    });
    console.log(result); // [undefined, undefined]
  3. Использование в тестах для подготовки данных: map идеально подходит для трансформации тестовых данных.

    // Подготовка моковых данных для тестирования функции отрисовки списка
    const mockUserIds = [101, 102, 103];
    const mockUsers = mockUserIds.map(id => ({
      id,
      name: `User_${id}`,
      isActive: id % 2 === 0 // Пример логики для разных данных
    }));
    
    // mockUsers теперь:
    // [
    //   { id: 101, name: 'User_101', isActive: false },
    //   { id: 102, name: 'User_102', isActive: true },
    //   { id: 103, name: 'User_103', isActive: false }
    // ]
  4. Сравнение с forEach: map предназначен для трансформации данных и возврата нового массива. forEach — для выполнения операций с побочными эффектами (например, отправка логов, сохранение в внешнюю переменную) и возвращает undefined.

При написании автотестов на JavaScript (например, с Jest) я часто использую map для создания наборов входных и ожидаемых данных для параметризованных тестов.