Transforming an array into an array of arrays

Question

I am trying to do an opposite of flattening an array.

I have the following input JSON array of 4 elements:

[
  {
    "nestedObj": {
      "id":12
    }
  },
  {
    "nestedObj": {
      "id":555
    }
  },
  {
    "nestedObj": {
      "id":555
    }
  },
  {
    "nestedObj" :{
      "id":771
    }
  }
]

I want to transform it to an array of arrays, where each subarray has elements of the same nestedObj.id grouped up together.

I can assume the initial JSON is sorted by nestedObj.id.

In the above example, the id of nestedObj of 2nd and 3rd element are the same (555), so those elements would be grouped into one sub-array.

This would be the result, an array of only 3 sub-array elements:

[
  [{
    "nestedObj": {
      "id":12
    }
  }],
  [{
    "nestedObj": {
      "id":555
    }
  },
  {
    "nestedObj": {
      "id":555
    }
  }],
  [{
    "nestedObj" :{
      "id":771
    }
  }]
]

And this is the code that gets me what I want:

const data = [ /* ...the above input data... */ ];
let result = [];
let prevId = null;
for (let elem of data) {
  let currId = elem.nestedObj.id;
  if (currId === prevId) {
    result[result.length - 1].push({...elem});
  } else {
    result.push([{...elem}]);
  }
  prevId = currId;
}

But as you can see... the code is very declarative. It's not very JavaScript-like, in a functional programming sense.

How can I re-write it using e.g. reduce or other 'modern JS' techniques?

Nina Scholz · Accepted Answer · 2020-08-16 20:08:30Z

3

Just group the objects.

let array = [{ nestedObj: { id: 12 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 771 } }],
    result = Object.values(array.reduce((r, o) => {
        (r[o.nestedObj.id] = r[o.nestedObj.id] || []).push(o);
        return r;
    }, {}));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Aug 16, 2020 at 20:08

answered Aug 16, 2020 at 20:01

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

1 Comment

weno Over a year ago

The 2nd and 3rd elements (of the same id) are not grouped up together, though.

Ele · Accepted Answer · 2020-08-16 20:06:10Z

2

You can group by id using the function reduce, extract the grouped values using the function Object.values, and finally map the array to build the desired output.

This is assuming we have only one attribute called nestedObj

let arr = [{ nestedObj: { id: 12 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 771 } }],
    result = Object.values(arr.reduce((a, {nestedObj: {id}}) => {
      (a[id] || (a[id] = [])).push(id);
      return a;
    }, {})).map(r => r.map(id => ({nestedObj: {id}})));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Aug 16, 2020 at 20:06

Ele

33.8k7 gold badges43 silver badges80 bronze badges

Comments

charlietfl · Accepted Answer · 2020-08-16 20:11:10Z

1

Use a Map to group the items with same id then get the final values from the Map

const data = [{ nestedObj: { id: 12 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 555 } }, { nestedObj: { id: 771 } }]

const map = new Map;

data.forEach(o => {
  const {nestedObj:{id}} = o;
  map.has(id) ? map.get(id).push(o) : map.set(id,[o]);
});

console.log([...map.values()])

answered Aug 16, 2020 at 20:11

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Collectives™ on Stack Overflow

Transforming an array into an array of arrays

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related