有没有办法在Javascript中通过lodash通过多个字段对数据进行分组答案

【问题标题】：Is there a way to groupBy data by multiple field by lodash in Javascript有没有办法在Javascript中通过lodash通过多个字段对数据进行分组
【发布时间】：2020-02-09 18:26:29
【问题描述】：

我想按多个字段对我的数据进行分组。所以，我添加了数据和预期结果。

const skus = [
  {
    id: 1,
    customAttributes: {
      Color: 'Red',
      Size: 'S',
      Season: 2019
    }
  },
  {
    id: 2,
    customAttributes: {
      Color: 'Red',
      Size: 'S',
      Season: 2020
    }
  },
  {
    id: 3,
    customAttributes: {
      Color: 'Red',
      Size: 'M',
      Season: 2019
    }
  },
  {
    id: 4,
    customAttributes: {
      Color: 'Red',
      Size: 'M',
      Season: 2020
    }
  },
  {
    id: 5,
    customAttributes: {
      Color: 'Red',
      Size: 'L',
      Season: 2019
    }
  },
  {
    id: 6,
    customAttributes: {
      Color: 'Red',
      Size: 'L',
      Season: 2020
    }
  },
  {
    id: 7,
    customAttributes: {
      Color: 'Green',
      Size: 'S',
      Season: 2019
    }
  },
  {
    id: 8,
    customAttributes: {
      Color: 'Green',
      Size: 'S',
      Season: 2020
    }
  },
  {
    id: 9,
    customAttributes: {
      Color: 'Green',
      Size: 'M',
      Season: 2019
    }
  },
  {
    id: 10,
    customAttributes: {
      Color: 'Green',
      Size: 'M',
      Season: 2020
    }
  },
  {
    id: 11,
    customAttributes: {
      Color: 'Green',
      Size: 'L',
      Season: 2019
    }
  },
  {
    id: 12,
    customAttributes: {
      Color: 'Green',
      Size: 'L',
      Season: 2020
    }
  }
];

console.log( // groupBy is working by 1 parameter, but I don't know to make it multiple parameter
  _.chain(skus)
    .map(sku => sku.customAttributes)
    .groupBy('Color')
    .map((value, key) => ({ title: key, skus: value }))
    .value()
);

// Just like: groupBy('Color', 'Size')

我想通过多个参数对这些 sku 进行分组，就像使用 lodash 的颜色和大小一样。

通过 1 个参数，它运行良好。但是当多个参数时，我就无法正确了。

预期结果是：

[
    {
        title: 'Red / S', // Color / Size
        skus: [
            {
                id: 1,
                customAttributes: {
                  Color: 'Red',
                  Size: 'S',
                  Season: 2019
                }
            },
            {
                id: 2,
                customAttributes: {
                  Color: 'Red',
                  Size: 'S',
                  Season: 2020
                }
            }
        ]
    },
    {
        title: 'Red / M', // Color / Size
        skus: [
            {
                id: 3,
                customAttributes: {
                  Color: 'Red',
                  Size: 'M',
                  Season: 2019
                }
            },
            {
                id: 4,
                customAttributes: {
                  Color: 'Red',
                  Size: 'M',
                  Season: 2020
                }
            }
        ]
    },
    ....
]

谢谢。

【问题讨论】：

标签： javascript angular typescript lodash

【解决方案1】：

将映射删除到customAttributes，因为您希望结果中包含id 的对象。将函数传递给_.groupBy()，并返回一个字符串，其中包含您要用作组键的字段。

const skus = [{"id":1,"customAttributes":{"Color":"Red","Size":"S","Season":2019}},{"id":2,"customAttributes":{"Color":"Red","Size":"S","Season":2020}},{"id":3,"customAttributes":{"Color":"Red","Size":"M","Season":2019}},{"id":4,"customAttributes":{"Color":"Red","Size":"M","Season":2020}},{"id":5,"customAttributes":{"Color":"Red","Size":"L","Season":2019}},{"id":6,"customAttributes":{"Color":"Red","Size":"L","Season":2020}},{"id":7,"customAttributes":{"Color":"Green","Size":"S","Season":2019}},{"id":8,"customAttributes":{"Color":"Green","Size":"S","Season":2020}},{"id":9,"customAttributes":{"Color":"Green","Size":"M","Season":2019}},{"id":10,"customAttributes":{"Color":"Green","Size":"M","Season":2020}},{"id":11,"customAttributes":{"Color":"Green","Size":"L","Season":2019}},{"id":12,"customAttributes":{"Color":"Green","Size":"L","Season":2020}}];

const result = _(skus)
  .groupBy(({ customAttributes: a }) => `${a.Color} / ${a.Size}`)
  .map((skus, title) => ({ title, skus }))
  .value();
  
console.log(result);

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"&gt;&lt;/script&gt;

【讨论】：

显然，我必须为这个 lodash 花费很多时间。非常感谢。它有效。