Слияние массива объектов без перезаписи

Question

В настоящее время я использую JSON, который должен быть структурирован в виде древовидной иерархии.Глубина иерархии сильно варьируется и поэтому неизвестна.

Как сейчас, я добился получения массива объектов.Пример ниже.

[
    {
      "name": "level1",
      "collapsed": true,
      "children": [
        {
          "name": "Level 1 item here",
          "id": 360082134191
        }
      ]
    },
    {
      "name": "level1",
      "collapsed": true,
      "children": [
        {
          "name": "level2",
          "collapsed": true,
          "children": [
            {
              "name": "Level 2 item here",
              "id": 360082134751
            }
          ]
        }
      ]
    },
    {
      "name": "level1",
      "collapsed": true,
      "children": [
        {
          "name": "Another level 1 item",
          "id": 360082262772
        }
      ]
    }
  ]

Чего я хочу добиться, так это объединения этих объектов без перезаписи или замены чего-либо.Ниже приведен пример того, как я хочу отформатировать данные:

[
  {
    "name": "level1",
    "collapsed": true,
    "children": [
      {
        "name": "level2",
        "collapsed": true,
        "children": [
          {
            "name": "Level 2 item here",
            "id": 360082134751
          }
        ]
      },
      {
        "name": "Level 1 item here",
        "id": 360082134191
      },
      {
        "name": "Another level 1 item",
        "id": 360082262772
      }
    ]
  }
]

Как бы я достиг этого с помощью JavaScript?Библиотеки не являются предпочтительными, ES6 можно использовать.

Редактировать: Важно, чтобы выходные данные представляли собой массив, поскольку элементы без дочерних элементов могут появляться в корне.

Answer 1

Я предполагаю, что вы хотите сгруппировать на основе свойства name в объекте уровня 1.Вы можете сделать простые reduce и Object.values, например:

const input = [{"name":"level1","collapsed":true,"children":[{"name":"Level 1 item here","id":360082134191}]},{"name":"level1","collapsed":true,"children":[{"name":"level2","collapsed":true,"children":[{"name":"Level 2 item here","id":360082134751}]}]},{"name":"level1","collapsed":true,"children":[{"name":"Another level 1 item","id":360082262772}]}]
  
const merged = input.reduce((r,{name, collapsed, children}) =>{
    r[name] = r[name] || {name, collapsed, children:[]};
    r[name]["children"].push(...children)
    return r;
}, {})
  
const final = Object.values(merged);
console.log(final)

Вы можете сделать все это в одной строке:

const input = [{"name":"level1","collapsed":true,"children":[{"name":"Level 1 item here","id":360082134191}]},{"name":"level1","collapsed":true,"children":[{"name":"level2","collapsed":true,"children":[{"name":"Level 2 item here","id":360082134751}]}]},{"name":"level1","collapsed":true,"children":[{"name":"Another level 1 item","id":360082262772}]}]

const output = Object.values(input.reduce((r,{name,collapsed,children}) => (
    (r[name] = r[name] || {name,collapsed,children: []})["children"].push(...children), r), {}))
console.log(output)

Answer 2

Полагаю, вам нужна небольшая помощь в работе с данными.Для этого может быть несколько способов, вот как мне это сделать.

// data => supplied data
const result = data.reduce ((acc, item) => {
  // if acc array already contains an object with same name,
  // as current element [item], merfe the children
  let existingItem;

  // Using a for loop here to create a reference to the
  // existing item, so it'd update this item when childrens
  // will be merged.
  for (let index = 0; index < acc.length; index ++) {
    if (acc[index].name === item.name) {
      existingItem = acc[index];
      break;
    }
  }
  // if existingItem exists, merge children of
  // existing item and current item.
  // else push it into the accumulator
  if (existingItem) {
    existingItem.children = existingItem.children.concat(item.children);
  } else {
    acc.push (item);
  }
  return acc;
}, []);