通常，我使用Lodash JavaScript实用程序库和预先构建的groupBy（）方法。它非常容易使用，请在此处查看更多详细信息。

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

无突变：

const groupBy = (xs, key) => xs.reduce((acc, x) => Object.assign({}, acc, {
  [x[key]]: (acc[x[key]] || []).concat(x)
}), {})

console.log(groupBy(['one', 'two', 'three'], 'length'));
// => {3: ["one", "two"], 5: ["three"]}

使用ES6 Map对象：

/***@描述*采用Array＜V＞和分组函数，*并返回由分组函数分组的数组的Map。**@param list V类型的数组。*@param keyGetter一个函数，将数组类型V作为输入，并返回类型K的值。*K通常是V的属性键。**@返回由分组函数分组的数组的映射。*///导出函数组By＜K，V＞（列表：Array＜V＞，keyGetter：（输入：V）=>K）：Map＜K，Array＜V>>{//const-map=new map<K，Array<V>>（）；函数groupBy（list，keyGetter）{const-map=new map（）；list.forEach（（项）=>{const key=keyGetter（项）；constcollection=map.get（key）；if（！集合）{map.set（键，[项]）；}其他{collection.push（项）；}});回归图；}//示例用法常量宠物=[｛type:“Dog”，name:“Spot”｝，{类型：“猫”，名称：“老虎”}，{类型：“狗”，名称：“路虎”}，｛类型：“猫”，名称：“利奥”｝];const grouped=groupBy（宠物，宠物=>宠物类型）；console.log（分组.get（“Dog”））；//->〔｛类型：“狗”，名称：“斑点”｝，｛类型“狗”、名称：“漫游者”｝〕console.log（分组.get（“Cat”））；//->〔｛类型：“猫”，名称：“老虎”｝，｛类型“猫”、名称：“狮子座”｝〕const奇数=符号（）；const even=符号（）；常量=[1,2,3,4,5,6,7]；const oddEven=groupBy（数字，x=>（x%2===1？奇数：偶数））；console.log（oddEven.get（奇数））；//->[1,3,5,7]console.log（oddEven.get（偶数））；//->[2,4,6]

关于地图：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

具有排序功能

export const groupBy = function groupByArray(xs, key, sortKey) {
      return xs.reduce(function(rv, x) {
        let v = key instanceof Function ? key(x) : x[key];
        let el = rv.find(r => r && r.key === v);

        if (el) {
          el.values.push(x);
          el.values.sort(function(a, b) {
            return a[sortKey].toLowerCase().localeCompare(b[sortKey].toLowerCase());
          });
        } else {
          rv.push({ key: v, values: [x] });
        }

        return rv;
      }, []);
    };

示例：

var state = [
    {
      name: "Arkansas",
      population: "2.978M",
      flag:
  "https://upload.wikimedia.org/wikipedia/commons/9/9d/Flag_of_Arkansas.svg",
      category: "city"
    },{
      name: "Crkansas",
      population: "2.978M",
      flag:
        "https://upload.wikimedia.org/wikipedia/commons/9/9d/Flag_of_Arkansas.svg",
      category: "city"
    },
    {
      name: "Balifornia",
      population: "39.14M",
      flag:
        "https://upload.wikimedia.org/wikipedia/commons/0/01/Flag_of_California.svg",
      category: "city"
    },
    {
      name: "Florida",
      population: "20.27M",
      flag:
        "https://upload.wikimedia.org/wikipedia/commons/f/f7/Flag_of_Florida.svg",
      category: "airport"
    },
    {
      name: "Texas",
      population: "27.47M",
      flag:
        "https://upload.wikimedia.org/wikipedia/commons/f/f7/Flag_of_Texas.svg",
      category: "landmark"
    }
  ];
console.log(JSON.stringify(groupBy(state,'category','name')));

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

常量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；｝