Object.groupBy()

Статический метод Object.groupBy() группирует элементы заданного итерируемого объекта в соответствии со строковыми значениями, возвращаемыми предоставленной функцией обратного вызова. Возвращаемый объект имеет отдельные свойства для каждой группы, содержащие массивы с элементами этой группы.

Этот метод следует использовать, когда имена групп могут быть представлены строками. Если вам нужно сгруппировать элементы, используя ключ, который является произвольным значением, используйте вместо этого Map.groupBy().

Попробовать

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 9 },
  { name: "bananas", type: "fruit", quantity: 5 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 12 },
  { name: "fish", type: "meat", quantity: 22 },
];

const result = Object.groupBy(inventory, ({ quantity }) =>
  quantity < 6 ? "restock" : "sufficient",
);
console.log(result.restock);
// [{ name: "bananas", type: "fruit", quantity: 5 }]

Синтаксис

Object.groupBy(items, callbackFn)

Параметры

items

Итерируемый объект (iterable) (такой как Array), элементы которого будут сгруппированы.

callbackFn

Функция, выполняемая для каждого элемента в итерируемом объекте. Она должна возвращать значение, которое может быть приведено к ключу свойства (строка или символ), указывающему группу текущего элемента. Функция вызывается со следующими аргументами:

element

Текущий обрабатываемый элемент.

index

Индекс текущего обрабатываемого элемента.

Возвращаемое значение

Объект с null-прототипом (объект с null-прототипом), имеющий свойства для всех групп, каждое из которых присвоено массиву, содержащему элементы соответствующей группы.

Описание

Object.groupBy() вызывает предоставленную функцию callbackFn один раз для каждого элемента в итерируемом объекте. Функция обратного вызова должна возвращать строку или символ (значения, не являющиеся ни одним из этих типов, приводятся к строкам), указывающие группу соответствующего элемента. Значения, возвращаемые callbackFn, используются в качестве ключей для объекта, возвращаемого Object.groupBy(). Каждый ключ имеет связанный массив, содержащий все элементы, для которых обратный вызов вернул то же самое значение.

Элементы в возвращаемом объекте и в исходном итерируемом объекте являются одними и теми же (это не глубокие копии). Изменение внутренней структуры элементов будет отражено как в исходном итерируемом объекте, так и в возвращаемом объекте.

Примеры

Использование Object.groupBy()

Сначала мы определяем массив, содержащий объекты, представляющие перечень различных продуктов питания. Каждый продукт имеет type и quantity.

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 5 },
  { name: "bananas", type: "fruit", quantity: 0 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 5 },
  { name: "fish", type: "meat", quantity: 22 },
];

Приведенный ниже код группирует элементы по значению их свойства type.

const result = Object.groupBy(inventory, ({ type }) => type);

/* Result is:
{
  vegetables: [
    { name: 'asparagus', type: 'vegetables', quantity: 5 },
  ],
  fruit: [
    { name: "bananas", type: "fruit", quantity: 0 },
    { name: "cherries", type: "fruit", quantity: 5 }
  ],
  meat: [
    { name: "goat", type: "meat", quantity: 23 },
    { name: "fish", type: "meat", quantity: 22 }
  ]
}
*/

Стрелочная функция просто возвращает type каждого элемента массива при каждом её вызове. Обратите внимание, что аргумент функции { type } является базовым примером синтаксиса деструктуризации объектов для аргументов функции. Это распаковывает свойство type объекта, переданного в качестве параметра, и присваивает его переменной с именем type в теле функции. Это очень лаконичный способ доступа к соответствующим значениям элементов внутри функции.

Мы также можем создавать группы, выведенные из значений одного или нескольких свойств элементов. Ниже приведён очень похожий пример, который помещает элементы в группы ok или restock, основываясь на значении поля quantity.

function myCallback({ quantity }) {
  return quantity > 5 ? "ok" : "restock";
}

const result2 = Object.groupBy(inventory, myCallback);

/* Result is:
{
  restock: [
    { name: "asparagus", type: "vegetables", quantity: 5 },
    { name: "bananas", type: "fruit", quantity: 0 },
    { name: "cherries", type: "fruit", quantity: 5 }
  ],
  ok: [
    { name: "goat", type: "meat", quantity: 23 },
    { name: "fish", type: "meat", quantity: 22 }
  ]
}
*/

Спецификации

Совместимость с браузерами

См. также

• Полифил Object.groupBy в core-js
• Полифил es-shims для Object.groupBy
• Руководство по Индексированным коллекциям
• Array.prototype.reduce()
• Object.fromEntries()
• Map.groupBy()