Самый эффективный метод группировки по массиву объектов в JavaScript

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

1. Подготовка данных

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

const users = [
  { name: 'John', age: 25, city: 'New York' },
  { name: 'Alice', age: 30, city: 'London' },
  { name: 'Bob', age: 20, city: 'Paris' },
  { name: 'Jane', age: 25, city: 'New York' },
  { name: 'Tom', age: 30, city: 'London' },
  { name: 'Kate', age: 20, city: 'Paris' },
];

2. Группировка по одному свойству

Первый метод группировки, который мы рассмотрим, основан на использовании объекта в качестве “карты” для хранения группированных элементов. Для этого создадим функцию groupByProperty, которая принимает массив объектов и имя свойства, по которому нужно сгруппировать элементы:

function groupByProperty(arr, property) {
  return arr.reduce((acc, obj) => {
    const key = obj[property];
    if (!acc[key]) {
      acc[key] = [];
    }
    acc[key].push(obj);
    return acc;
  }, {});
}

const groupedUsers = groupByProperty(users, 'age');
console.log(groupedUsers);

Результат выполнения кода будет следующим:

{
  20: [
    { name: 'Bob', age: 20, city: 'Paris' },
    { name: 'Kate', age: 20, city: 'Paris' }
  ],
  25: [
    { name: 'John', age: 25, city: 'New York' },
    { name: 'Jane', age: 25, city: 'New York' }
  ],
  30: [
    { name: 'Alice', age: 30, city: 'London' },
    { name: 'Tom', age: 30, city: 'London' }
  ]
}

3. Группировка по нескольким свойствам

В некоторых случаях может потребоваться группировка по нескольким свойствам. Для этого можно использовать массив ключей в качестве “карты” для хранения группированных элементов. Рассмотрим функцию groupByProperties, которая принимает массив объектов и массив свойств, по которым нужно сгруппировать элементы:

function groupByProperties(arr, properties) {
  return arr.reduce((acc, obj) => {
    const key = properties.map(property => obj[property]).join('|');
    if (!acc[key]) {
      acc[key] = [];
    }
    acc[key].push(obj);
    return acc;
  }, {});
}

const groupedUsers = groupByProperties(users, ['age', 'city']);
console.log(groupedUsers);

Результат выполнения кода будет следующим:

{
  '20|Paris': [
    { name: 'Bob', age: 20, city: 'Paris' },
    { name: 'Kate', age: 20, city: 'Paris' }
  ],
  '25|New York': [
    { name: 'John', age: 25, city: 'New York' },
    { name: 'Jane', age: 25, city: 'New York' }
  ],
  '30|London': [
    { name: 'Alice', age: 30, city: 'London' },
    { name: 'Tom', age: 30, city: 'London' }
  ]
}

4. Использование Map

Еще одним эффективным методом группировки является использование структуры данных Map. Для этого создадим функцию groupByMap, которая принимает массив объектов и имя свойства, по которому нужно сгруппировать элементы:

function groupByMap(arr, property) {
  const map = new Map();
  arr.forEach(obj => {
    const key = obj[property];
    if (!map.has(key)) {
      map.set(key, []);
    }
    map.get(key).push(obj);
  });
  return Object.fromEntries(map);
}

const groupedUsers = groupByMap(users, 'age');
console.log(groupedUsers);

Результат выполнения кода будет таким же, как и в предыдущем примере.

5. Сравнение эффективности методов

Теперь давайте сравним эффективность трех методов группировки: groupByProperty, groupByProperties и groupByMap. Для этого создадим массив объектов с большим количеством элементов:

const bigArray = [];
for (let i = 0; i < 1000000; i++) {
  bigArray.push({ id: i, value: Math.random() });
}

Замерим время выполнения каждого метода для группировки по свойству id:

console.time('groupByProperty');
groupByProperty(bigArray, 'id');
console.timeEnd('groupByProperty');

console.time('groupByProperties');
groupByProperties(bigArray, ['id']);
console.timeEnd('groupByProperties');

console.time('groupByMap');
groupByMap(bigArray, 'id');
console.timeEnd('groupByMap');

Результаты замеров могут быть различными в зависимости от производительности вашего компьютера, но обычно метод groupByMap работает быстрее других методов.

6. Заключение

В этой статье мы рассмотрели самый эффективный метод группировки по массиву объектов в JavaScript. Мы изучили три различных метода: groupByProperty, groupByProperties и groupByMap. Каждый из них имеет свои преимущества и может быть использован в зависимости от конкретной задачи. Рекомендуется использовать метод groupByMap, если требуется максимальная производительность.