Javascript 中使用 Lodash 或下划线的多列 GroupBy

Question

转换 JSON 结构时出现问题。我的 JSON 结构如下。

const member = [{
    memberId: 4,
    memberName: 'ABC',
    age: 22,
    eventId: 5,
    eventName: 'Dance'
  },
  {
    memberId: 4,
    memberName: 'ABC',
    age: 22,
    eventId: 6,
    eventName: 'Music'
  },
  {
    memberId: 4,
    memberName: 'ABC',
    age: 22,
    eventId: 7,
    eventName: 'FootBall'
  },
  {
    memberId: 5,
    memberName: 'PQR',
    age: 24,
    eventId: 6,
    eventName: 'Music'
  },
  {
    memberId: 5,
    memberName: 'PQR',
    age: 24,
    eventId: 5,
    eventName: 'Dance'
  },
]

这里我有两个成员有相关事件。我想按如下方式转换 JSON。

const member = [
  {
    memberId: 4,
    memberName: 'ABC',
    age: 22,
    events: [
      {
        id: 5,
        name: 'Dance'
      },
      {
        id: 6,
        name: 'Music'
      },
      {
        id: 7,
        name: 'FootBall'
      }
    ]
  },
  {
    memberId: 5,
    memberName: 'PQR',
    age: 24,
    events: [
      {
        id: 6,
        name: 'Music'
      },
      {
        id: 5,
        name: 'Dance'
      }
    ]
  }
]

我尝试使用以下代码创建结构，但它没有提供所需的输出。它只是创建两个键值对。

var result = _.chain(member)
            .groupBy("memberId")
            .pairs()
            .map(function(currentItem) {
                return _.object(_.zip(["memberId", "events"], currentItem));
            })
            .value();

我不知道如何在层次结构中添加 JSON 的其他值。

Answer 1

将项目分组后，将它们映射。取每组的第一项，删除事件属性，然后展开。要获取事件数据，请映射组的项目并仅获取相关事件属性：

const member = [{"memberId":4,"memberName":"ABC","age":22,"eventId":5,"eventName":"Dance"},{"memberId":4,"memberName":"ABC","age":22,"eventId":6,"eventName":"Music"},{"memberId":4,"memberName":"ABC","age":22,"eventId":7,"eventName":"FootBall"},{"memberId":5,"memberName":"PQR","age":24,"eventId":6,"eventName":"Music"},{"memberId":5,"memberName":"PQR","age":24,"eventId":5,"eventName":"Dance"}]

const result = _(member)
  .groupBy('memberId')
  .map(group => ({
    ..._.omit(_.head(group), ['eventId', 'eventName']),
    events: _.map(group, o => ({ id: o.eventId, name: o.eventName }))
  }))
  .value();
  
console.log(result)

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"></script>

以及使用下划线的相同解决方案：

const member = [{"memberId":4,"memberName":"ABC","age":22,"eventId":5,"eventName":"Dance"},{"memberId":4,"memberName":"ABC","age":22,"eventId":6,"eventName":"Music"},{"memberId":4,"memberName":"ABC","age":22,"eventId":7,"eventName":"FootBall"},{"memberId":5,"memberName":"PQR","age":24,"eventId":6,"eventName":"Music"},{"memberId":5,"memberName":"PQR","age":24,"eventId":5,"eventName":"Dance"}]

const result = _.chain(member) // <- change for underscore 
  .groupBy('memberId')
  .map(group => ({
    ..._.omit(_.head(group), ['eventId', 'eventName']),
    events: _.map(group, o => ({ id: o.eventId, name: o.eventName }))
  }))
  .value();
  
console.log(result)

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js"></script>

Javascript 中使用 Lodash 或下划线的多列 GroupBy

GroupBy with Multiple Columns using Lodash or Underscore in Javascript

javascript

json

underscore.js

lodash