在 JavaScript 中对一组对象进行分组

本文将演示在 JavaScript 中对对象数组进行分组的最有效方法。

目录

1.用于reduce()在JavaScript 中对对象数组进行分组

---

在JavaScript中对reduce() 对象数组进行分组的最有效方法是使用函数。此方法执行每个数组元素的（指定）reducer 函数并生成单个输出值。

例子：

我们有一个包含名称和类别这两个属性的产品列表

const products = [
    { name: "Mathematics", category: "Subject" },
    { name: "Cow", category: "Animal" },
    { name: "Science", category: "Subject" },
];

在上面的例子中，products是一个对象数组。

接下来，我们需要执行一个简单的操作。使用产品列表，我们将按类别对产品进行分组。

const groupByCategory = {
    Subjects: [
        { name: "Mathematics", category: "Subjects" },
        { name: "Science", category: "Subjects" },
    ],
    Animals: [{ name: "Cow", category: "Animals" }],
};

 从产品数组中获取类数组的常用方法是使用适当的回调函数groupByCategory调用该方法。array.reduce()

const groupByCategory = products.reduce((group, product) => {
    const { category } = product;
    group[category] = group[category] ?? [];
    group[category].push(product);
    return group;
}, {});

输出： 

"{
    'Subject': [
        {
            'name': 'Mathematics',
            'category': 'Subject'
        },
        {
            'name': 'Science',
            'category': 'Subject'
        }
    ],
    'Animal': [
        {
            'name': 'Cow',
            'category': 'Animal'
        }
    ]
}"

 看演示

该products.reduce()函数将数组简化为按类别分组的产品对象。 

( array.groupBycallback) 接受使用三个参数调用的回调函数：当前数组元素、索引和数组本身。回调必须返回一个字符串（您要向其添加功能的组名）。

const groupedObject = array.groupBy((item, index, array) => {
    ...
    return groupNameAsString;
});