我对公认的答案进行了扩展，包括按多个财产分组，然后再加上，使其完全起作用，没有变异。观看演示https://stackblitz.com/edit/typescript-ezydzv

export interface Group {
  key: any;
  items: any[];
}

export interface GroupBy {
  keys: string[];
  thenby?: GroupBy;
}

export const groupBy = (array: any[], grouping: GroupBy): Group[] => {
  const keys = grouping.keys;
  const groups = array.reduce((groups, item) => {
    const group = groups.find(g => keys.every(key => item[key] === g.key[key]));
    const data = Object.getOwnPropertyNames(item)
      .filter(prop => !keys.find(key => key === prop))
      .reduce((o, key) => ({ ...o, [key]: item[key] }), {});
    return group
      ? groups.map(g => (g === group ? { ...g, items: [...g.items, data] } : g))
      : [
          ...groups,
          {
            key: keys.reduce((o, key) => ({ ...o, [key]: item[key] }), {}),
            items: [data]
          }
        ];
  }, []);
  return grouping.thenby ? groups.map(g => ({ ...g, items: groupBy(g.items, grouping.thenby) })) : groups;
};

这是一个基于TS的功能，不是性能最好的，但很容易阅读和理解！

function groupBy<T>(array: T[], key: string): Record<string, T[]> {
const groupedObject = {}
for (const item of array) {
  const value = item[key]
    if (groupedObject[value] === undefined) {
  groupedObject[value] = []
  }
  groupedObject[value].push(item)
}
  return groupedObject
}

我们以->

const data = [
{ Phase: "Phase 1", Step: "Step 1", Task: "Task 1", Value: "5" },
{ Phase: "Phase 1", Step: "Step 1", Task: "Task 2", Value: "10" },
{ Phase: "Phase 1", Step: "Step 2", Task: "Task 1", Value: "15" },
{ Phase: "Phase 1", Step: "Step 2", Task: "Task 2", Value: "20" },
];
console.log(groupBy(data, 'Step'))
{
'Step 1': [
    {
      Phase: 'Phase 1',
      Step: 'Step 1',
      Task: 'Task 1',
      Value: '5'
    },
    {
      Phase: 'Phase 1',
      Step: 'Step 1',
      Task: 'Task 2',
      Value: '10'
    }
  ],
  'Step 2': [
    {
      Phase: 'Phase 1',
      Step: 'Step 2',
      Task: 'Task 1',
      Value: '15'
    },
    {
      Phase: 'Phase 1',
      Step: 'Step 2',
      Task: 'Task 2',
      Value: '20'
    }
  ]
}

Ceasar的答案很好，但只适用于数组中元素的内部财产（字符串的长度）。

这个实现的工作方式更像：这个链接

const groupBy = function (arr, f) {
    return arr.reduce((out, val) => {
        let by = typeof f === 'function' ? '' + f(val) : val[f];
        (out[by] = out[by] || []).push(val);
        return out;
    }, {});
};

希望这有帮助。。。

您可以使用本机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>

现在有点晚了，但也许有人喜欢这个。

ES6:

常量用户=[{name：“Jim”，颜色：“蓝色”},{name：“Sam”，颜色：“蓝色”},{name：“Eddie”，颜色：“绿色”},{姓名：“Robert”，颜色：“绿色”},];常量groupBy=（arr，key）=>{const initialValue=｛｝；返回arr.reduce（（acc，cval）=>{const myAttribute=cval[key]；acc[myAttribute]=[…（acc[myAattribute]| |[]），cval]返回acc；}，initialValue）；};const res=groupBy（用户，“颜色”）；console.log（“分组依据：”，res）；

这里有一个ES6版本，不会在空成员上中断

function groupBy (arr, key) {
  return (arr || []).reduce((acc, x = {}) => ({
    ...acc,
    [x[key]]: [...acc[x[key]] || [], x]
  }), {})
}