您可以使用本机JavaScript组数组方法（目前处于第3阶段）。

我认为，与reduce相比，或者与lodash等第三方库相比，解决方案要优雅得多。

常量产品=[{名称：“牛奶”，类型：“乳制品”},{名称：“cheese”，类型：“乳制品”},{名称：“牛肉”，类型：“肉”},{名称：“chicken”，类型：“肉”}];const productsByType=products.group（（product）=>product.type）；console.log（“按类型分组的产品：”，productsByType）；<script src=“https://cdn.jsdelivr.net/npm/core-js-bundle@3.23.2/minified.min.js“></script>

GroupBy one liner，ES2021解决方案

const groupBy = (x,f)=>x.reduce((a,b,i)=>((a[f(b,i,x)]||=[]).push(b),a),{});

TypeScript（类型脚本）

const groupBy = <T>(array: T[], predicate: (value: T, index: number, array: T[]) => string) =>
  array.reduce((acc, value, index, array) => {
    (acc[predicate(value, index, array)] ||= []).push(value);
    return acc;
  }, {} as { [key: string]: T[] });

示例

const groupBy = (x,f)=>x.reduce((a,b,i)=>((a[f(b,i,x)]||=[]).push(b),a),{});
// f -> should must return string/number because it will be use as key in object

// for demo

groupBy([1, 2, 3, 4, 5, 6, 7, 8, 9], v => (v % 2 ? "odd" : "even"));
// { odd: [1, 3, 5, 7, 9], even: [2, 4, 6, 8] };
const colors = [
  "Apricot",
  "Brown",
  "Burgundy",
  "Cerulean",
  "Peach",
  "Pear",
  "Red",
];

groupBy(colors, v => v[0]); // group by colors name first letter
// {
//   A: ["Apricot"],
//   B: ["Brown", "Burgundy"],
//   C: ["Cerulean"],
//   P: ["Peach", "Pear"],
//   R: ["Red"],
// };
groupBy(colors, v => v.length); // group by length of color names
// {
//   3: ["Red"],
//   4: ["Pear"],
//   5: ["Brown", "Peach"],
//   7: ["Apricot"],
//   8: ["Burgundy", "Cerulean"],
// }

const data = [
  { comment: "abc", forItem: 1, inModule: 1 },
  { comment: "pqr", forItem: 1, inModule: 1 },
  { comment: "klm", forItem: 1, inModule: 2 },
  { comment: "xyz", forItem: 1, inModule: 2 },
];

groupBy(data, v => v.inModule); // group by module
// {
//   1: [
//     { comment: "abc", forItem: 1, inModule: 1 },
//     { comment: "pqr", forItem: 1, inModule: 1 },
//   ],
//   2: [
//     { comment: "klm", forItem: 1, inModule: 2 },
//     { comment: "xyz", forItem: 1, inModule: 2 },
//   ],
// }

groupBy(data, x => x.forItem + "-" + x.inModule); // group by module with item
// {
//   "1-1": [
//     { comment: "abc", forItem: 1, inModule: 1 },
//     { comment: "pqr", forItem: 1, inModule: 1 },
//   ],
//   "1-2": [
//     { comment: "klm", forItem: 1, inModule: 2 },
//     { comment: "xyz", forItem: 1, inModule: 2 },
//   ],
// }

按映射分组

const groupByToMap = (x, f) =>
  x.reduce((a, b, i, x) => {
    const k = f(b, i, x);
    a.get(k)?.push(b) ?? a.set(k, [b]);
    return a;
  }, new Map());

TypeScript（类型脚本）

const groupByToMap = <T, Q>(array: T[], predicate: (value: T, index: number, array: T[]) => Q) =>
  array.reduce((map, value, index, array) => {
    const key = predicate(value, index, array);
    map.get(key)?.push(value) ?? map.set(key, [value]);
    return map;
  }, new Map<Q, T[]>());

一种新的方法，有一个用于分组的对象和另外两个用于创建键的函数，并获得一个包含所需分组项的对象和另一个用于添加值的键。

常量groupBy=（数组，组，valueKey）=>{常量getKey=o=>groups.map（k=>o[k]）.join（'|'），getObject=o=>Object.fromEntries（[…groups.map（k=>[k，o[k]]），[valueKey，0]）；groups=[].contat（组）；return Object.values（array.reduce（（r，o）=>{（r[getKey（o）]？？=getObject（o））[valueKey]+=+o[valueKey]；返回r；}, {}));},data=[｛阶段：“阶段1”，步骤：“步骤1”，任务：“任务1”，值：“5”｝，｛阶段“阶段1“，步骤：”步骤1“，任务：”任务2“，值：”10“｝，{阶段：”阶段1“、步骤：”第2“、任务：”第1“、值：”15“｝、｛阶段”阶段1”、步骤：“第2”、任务：“2”、值：“20”｝、{阶段“第2阶段”，步骤“步骤：”第一步“，任务“任务：”，值“25”｝阶段：“阶段2”，步骤：“步骤1”，任务：“任务2”，值：“30”｝，｛阶段：“阶段2”，步骤：“步骤2”，任务：“任务1”，值：”35“｝，{阶段：”阶段2“，步骤：”步骤2“，任务：”任务2“，值：：”40“｝]；console.log（groupBy（data，'Phase'，'Value'））；console.log（groupBy（数据，['Phase'，'Step']，'Value'））；.作为控制台包装｛最大高度：100%！重要；顶部：0；｝

旧方法：

虽然这个问题有一些答案，而且答案看起来有点过于复杂，但我建议使用香草Javascript进行分组，并使用嵌套的（如果需要）Map。

函数groupBy（数组，组，valueKey）{var map=新地图；groups=[].contat（组）；返回数组.reduce（（r，o）=>{groups.reduce（（m，k，i，{length}）=>{var子；如果（m.has（o[k]））返回m.get（o[k]）；如果（i+1==长度）{child=对象.assign（…groups.map（k=>（｛[k]：o[k]｝）），｛[valueKey]：0｝）；r.push（儿童）；}其他{child=新地图；}m.set（o[k]，子）；回归儿童；}，map）[valueKey]+=+o[valueKey]；返回r；}, [])};var data=[｛阶段：“阶段1”，步骤：“步骤1”，任务：“任务1”，值：“5”｝，｛阶段“阶段1“，步骤：”步骤1“，任务：”任务2“，值：”10“｝，{阶段：”阶段1“、步骤：”阶段2“，任务1“，值“15”｝、｛阶段”阶段1”、步骤：“阶段2”，任务2“、值：”20“｝、{阶段2“、步骤1”、任务1“、任务1”、值：“25”}，｛阶段：“阶段2”，步骤：“步骤1”，任务：“任务2”，值：“30”｝，｛阶段：“阶段2”，步骤：“步骤2”，任务：“任务1”，值：”35“｝，{阶段：”阶段2“，步骤：”步骤2“，任务：”任务2“，值：：”40“｝]；console.log（groupBy（data，'Phase'，'Value'））；console.log（groupBy（数据，['Phase'，'Step']，'Value'））；.作为控制台包装｛最大高度：100%！重要；顶部：0；｝

让我们生成一个通用的Array.protocol.groupBy（）工具。为了多样化，让我们在递归方法上使用ES6 fancyty扩展运算符进行Haskell式模式匹配。同样，让我们让Array.prototype.groupBy（）接受一个回调，该回调将项（e）、索引（i）和应用的数组（a）作为参数。

Array.prototype.groupBy=函数（cb）{返回函数迭代（[x，…xs]，i=0，r=[[]，[]]）{cb（x，i，[x，…xs]）？（r[0].推（x），r）：（r[1].推（x），r）；是否返回xs.length？迭代（xs，++i，r）：r；}（本）；};var arr=[0,1,2,3,4,5,6,7,8,9]，res=arr.groupBy（e=>e<5）；console.log（res）；

Array.prototype.groupBy=函数（groupingKeyFn）{if（groupingKeyFn的类型！=='函数'）{throw new Error（“groupBy将函数作为唯一参数”）；}返回this。reduce（（result，item）=>{let key=groupingKeyFn（项）；if（！result[key]）result[key]=[]；result[key].push（项）；返回结果；}, {});}变量a=[｛type:“video”，名称：“a”｝，｛type:“image”，名称：“b”｝，｛type:“video”，名称：“c”｝，｛type:“blog”，名称：“d”｝，{type:“video”，名称：“e”}，]console.log（a.groupBy（（item）=>item.type））；<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script>

在Joseph Nields的回答之后，有一个polyfill用于将对象分组https://github.com/padcom/array-prototype-functions#arrayprototypegroupbyfieldormapper.因此，您可能希望使用现有的内容，而不是一次又一次地编写这些内容。