Эффективное добавление новых ключей в массив объектов с использованием карты в JavaScript

В JavaScript метод mapявляется мощным инструментом для управления массивами. Это позволяет нам перебирать каждый элемент массива и выполнять над ним операции. Одной из распространенных задач является добавление новых ключей к объектам в массиве. В этой статье мы рассмотрим различные методы эффективного добавления новых ключей в массив объектов с помощью метода map. Мы предоставим примеры кода и объясним концепции простым разговорным языком.

Метод 1: использование оператора распространения
Оператор распространения — это удобная функция JavaScript, которая позволяет нам создавать новый объект, копируя свойства существующего объекта. Мы можем использовать этот оператор для добавления новых ключей к объектам в массиве с помощью метода map. Вот пример:

const array = [{ name: 'John' }, { name: 'Jane' }];
const newArray = array.map(obj => ({ ...obj, age: 25 }));
console.log(newArray);

В этом примере мы используем оператор распространения { ...obj }для создания поверхностной копии каждого объекта в массиве. Затем мы добавляем новую пару ключ-значение age: 25к каждому скопированному объекту. Полученный newArrayбудет содержать исходные объекты с дополнительным ключом age.

Метод 2: использование Object.assign()
Другой подход к добавлению новых ключей к объектам в массиве — использование метода Object.assign(). Этот метод позволяет нам объединить несколько объектов в один. Вот пример:

const array = [{ name: 'John' }, { name: 'Jane' }];
const newArray = array.map(obj => Object.assign({}, obj, { age: 25 }));
console.log(newArray);

В этом методе мы создаем новый пустой объект, используя Object.assign({}, obj), который служит целевым объектом для слияния. Затем мы передаем исходный объект objи новую пару ключ-значение { age: 25 }в качестве аргументов в Object.assign(). Полученный newArrayбудет содержать исходные объекты с дополнительным ключом age.

Метод 3: использование синтаксиса расширения объектов (ECMAScript 2018)
Если вы работаете с ECMAScript 2018 или более поздней версии, вы также можете использовать синтаксис расширения объектов для добавления новых ключей к объектам в массиве. Вот пример:

const array = [{ name: 'John' }, { name: 'Jane' }];
const newArray = array.map(obj => ({ ...obj, age: 25 }));
console.log(newArray);

Этот метод аналогичен методу 1, но использует синтаксис расширения объектов непосредственно внутри функции map. Полученный newArrayбудет содержать исходные объекты с дополнительным ключом age.

В этой статье мы рассмотрели три эффективных метода добавления новых ключей к объектам в массиве с помощью метода mapв JavaScript. Мы рассмотрели использование оператора расширения Object.assign()и синтаксиса расширения объекта. Используя эти методы, вы можете легко выполнять операции добавления ключей к массивам объектов и поддерживать эффективность кода.