javascript - 按每个对象的多个字段分组

Question

我正在尝试确定最佳数据类型，以将对象数组排序为由属性定义的组。我有一个对象数组，如下所示:

var people = [
    {
        name: 'Pete',
        gender: 'Male',
        age: 22

    },
    {
        name: 'Samantha',
        gender: 'Female',
        age: 20

    },
    {
        name: 'Frank',
        gender: 'Male',
        age: 22

    },
    {
        name: 'Gary',
        gender: 'Male',
        age: 21

    },
    {
        name: 'Maria',
        gender: 'Female',
        age: 20

    },
    {
        name: 'Hannah',
        gender: 'Female',
        age: 21

    },
    {
        name: 'Pete',
        gender: 'Male',
        age: 20

    }
];

我需要将这些对象分组到一个任意定义的组中。例如:

1. 第 1 组:性别
2. 第 2 组:年龄

(这可以由服务器定义，如果我们愿意，可以更改为包含第三组。)

然后给我(视觉上):

Male:
   21:
     Gary
   22:
     Pete
     Frank

Female
   20:
     Samantha
     Maria
   21:
     Hannah

我认为合适的数据类型是对象的对象。即:

{
    Male: {
        21: {
            [
                {
                    name: 'Gary',
                    gender: 'Male',
                    age: 21

                }
            ]
        },
        22: {
            [
                {
                    name: 'Pete',
                    gender: 'Male',
                    age: 22

                },
                {
                    name: 'Frank',
                    gender: 'Male',
                    age: 22

                }
            ]
        }
    },
    Female: {
        20: {
            [
                {
                    name: 'Samantha',
                    gender: 'Female',
                    age: 20

                },
                {
                    name: 'Maria',
                    gender: 'Female',
                    age: 20

                }
            ]
        },
        21: {
            [
                {
                    name: 'Hannah',
                    gender: 'Female',
                    age: 21

                }
            ]
        }
    }
}

但我无法想出一个合适的算法来将这些对象分类为代表上述内容的数据类型。

underscore.js 中有一个名为 _.groupBy(arr, callback) 的实用工具，我可以按如下方式使用它:

_.groupBy(people, function (person) {
    var props = ['gender', 'age'], // server-defined
        prop = [];

    for (var i = 0, length = props.length; i < length; i++) {
        prop.push(person[props[i]]);
    }

    return prop.join('|');
});

这给了我一个深度为 1 的对象，我可以使用 for...in 循环来遍历键，然后循环构建上面的对象，但这只是我坚持的代码。

返回的对象将是:

{
    "Male|22": [
        {
            "name": "Pete",
            "gender": "Male",
            "age": 22
        },
        {
            "name": "Frank",
            "gender": "Male",
            "age": 22
        }
    ],
    "Female|20": [
        {
            "name": "Samantha",
            "gender": "Female",
            "age": 20
        },
        {
            "name": "Maria",
            "gender": "Female",
            "age": 20
        }
    ],
    "Male|21": [
        {
            "name": "Gary",
            "gender": "Male",
            "age": 21
        }
    ],
    "Female|21": [
        {
            "name": "Hannah",
            "gender": "Female",
            "age": 21
        }
    ],
    "Male|20": [
        {
            "name": "Pete",
            "gender": "Male",
            "age": 20
        }
    ]
}

我正在考虑然后遍历对象中的每个键，在管道 (|) 处拆分并使用递归构造一个包含数据组/数组的对象的新对象。

这是实现此目标的一种非常可怕的方式，但我不知道该怎么做。

还有我想念的更好的方法吗？

Answer 1

也许这对你有帮助。它使用一个包含对象属性的数组，结果按属性的内容分组。

forEach 循环遍历数据。 reduce 循环用于为每个给定的组生成分组属性，如果它是最后一个，则返回一个数组(如果不存在的话)。

最后一步是将其中一个人的值插入数组。

var people = [{ name: 'Pete', gender: 'Male', age: 22 }, { name: 'Samantha', gender: 'Female', age: 20 }, { name: 'Frank', gender: 'Male', age: 22 }, { name: 'Gary', gender: 'Male', age: 21 }, { name: 'Maria', gender: 'Female', age: 20 }, { name: 'Hannah', gender: 'Female', age: 21 }, { name: 'Pete', gender: 'Male', age: 20 }],
    groups = ['gender', 'age'],
    grouped = {};

people.forEach(function (a) {
    groups.reduce(function (o, g, i) {                            // take existing object,
        o[a[g]] = o[a[g]] || (i + 1 === groups.length ? [] : {}); // or generate new obj, or
        return o[a[g]];                                           // at last, then an array
    }, grouped).push(a);
});

document.write('<pre>' + JSON.stringify(grouped, 0, 4) + '</pre>');