how to flatten array of object to multiple levels?

Question

I have an array of object which inturn has multiple array of object inside, the subGroups can be up to nth level and I want to flatten it to single array of object.

Input

obj = [{ id: a1, name: "apple", subGroups:  [{id: a2, name: "apple-a", subGroups: {id: a3, name: "apple-b", subGroups:  [{id: a4, name: "apple-c", subGroups: {id: a5, name: "apple-d", subGroups:[]}}]}}]}]

Expected output

[{ id: a1, name: "apple"}, {id: a2, name: "apple-a"}, {id: a3, name: "apple-b"}, {id: a4, name: "apple-c"},{id: a5, name: "apple-d"}]

I have used flat map and reduce but I'm only able to flatten upto second level. pls help

const arr = obj.reduce(
      (arr, elem) => [...arr, ...elem.subGroups], []
    )
    console.log(arr)

Some of your subgroups are arrays, and some are objects. Is that really how the data is laid out? — user12407908
– user12407908, Commented Oct 21, 2020 at 6:59

trincot · Accepted Answer · 2020-10-21 07:01:31Z

3

You'll need recursion. I assume here that subGroups is always an array (or undefined/null):

let obj = [{ id: "a1", name: "apple", subGroups:  [{id: "a2", name: "apple-a", subGroups: [{id: "a3", name: "apple-b", subGroups:  [{id: "a4", name: "apple-c", subGroups: [{id: "a5", name: "apple-d", subGroups:[]}]}]}]}]}]

const flatten = (groups) => 
    (groups || []).flatMap(({subGroups, ...o}) => [o, ...flatten(subGroups)]);

console.log(flatten(obj));

answered Oct 21, 2020 at 7:01

trincot

357k38 gold badges282 silver badges338 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Derek Wang · Accepted Answer · 2020-10-21 06:58:56Z

2

This can be done recursively as follows.

const input = [{
  id: "a1",
  name: "apple",
  subGroups: [{
    id: "a2",
    name: "apple-a",
    subGroups: [{
      id: "a3",
      name: "apple-b",
      subGroups: [{
        id: "a4",
        name: "apple-c",
        subGroups: [{
          id: "a5",
          name: "apple-d",
          subGroups: []
        }]
      }]
    }]
  }]
}];

function loopValues(val) {
  let q = [];
  val.forEach(elm => {
    if(elm == null) {
      return;
    }
    
    const { subGroups, ...rest } = elm;
    q = [...q, rest, ...loopValues(subGroups)];
  });
  return q;
}

const output = loopValues(input);
console.log(output);

answered Oct 21, 2020 at 6:58

Derek Wang

10.2k4 gold badges20 silver badges40 bronze badges

Comments

Miquel Las Heras · Accepted Answer · 2020-10-21 07:29:15Z

function flatten(array, currentArray) {
  if (!array) return currentArray;

  return array.reduce((acumulatedArray, currentElement) => {
    const { subGroups, ...element } = currentElement;
    return [...acumulatedArray, element, ...flatten(subGroups, [])];
  }, currentArray);
}

// Or width flatMap

function flatten(array, currentArray) {
  if (!array) return currentArray;

  return [...array.flatMap((currentElement) => {
    const { subGroups, ...element } = currentElement;
    return [element, ...flatten(subGroups, [])];
  }), ...currentArray];
}

const res = flatten(
  [
    {
      id: "a1",
      name: "apple",
      subGroups: [
        {
          id: "a2",
          name: "apple-a",
          subGroups: [
            {
              id: "a3",
              name: "apple-b",
              subGroups: [
                {
                  id: "a4",
                  name: "apple-c",
                  subGroups: [{ id: "a5", name: "apple-d", subGroups: [] }],
                },
              ],
            },
          ],
        },
      ],
    },
  ],
  []
);

console.log(res);

Collectives™ on Stack Overflow

how to flatten array of object to multiple levels?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related