【问题标题】:GroupBy with Multiple Columns using Lodash or Underscore in JavascriptGroupBy 在 Javascript 中使用 Lodash 或 Underscore 的多列
【发布时间】:2019-07-27 20:59:58
【问题描述】:

在转换 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 的其他值。

【问题讨论】:

    标签: javascript json underscore.js lodash


    【解决方案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)
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js"&gt;&lt;/script&gt;

    【讨论】:

    • 感谢您的回答,但是当我尝试使用 Angular 代码时,我收到“下划线__WEBPACK_IMPORTED_MODULE_2__(...).groupBy(...).map 不是函数的错误” "所以错过了什么。
    • 您可能使用的是下划线而不是 lodash,或者您的捆绑方式可能存在问题。它与问题无关,也与答案无关。答案是否符合您的要求?
    • 是否可以使用下划线来执行此操作?
    猜你喜欢
    • 2016-10-24
    • 1970-01-01
    • 1970-01-01
    • 2014-09-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多