JavaScript : Simplifying array with reduce() and map() resulting in undefined

Viewed 102

sample = [
    {
      key1: 'value1',
      key2: 'val1',
      key3: [{ subkey1: 'a', subkey2: 'b' }]
    },
    {
      key1: 'value2',
      key2: 'val2',
      key3: [{ subkey1: 'c', subkey2: 'd' }]
    },
    {
      key1: 'value3',
      key2: 'val3',
      key3: [{ subkey1: 'e', subkey2: 'f' }]
    },
    {
      key1: 'value3',
      key2: 'val3',
      key3: [{ subkey1: 'g', subkey2: 'h' }]
    },
    {
      key1: 'value3',
      key2: 'val3',
      key3: [{ subkey1: 'i', subkey2: 'j' }]
    },
    { key1: 'value3', key2: 'val3', key3: [{ subkey1: 'k', subkey2: 'l' }] }
  ];

  result = Array.from(
    this.sample.reduce(
      (m, { key1, key3, key2 }) =>
        m.set(key1, [...(m.get(key1) || []), key3, key2]),
      new Map()
    ),
    ([key1, key3, key2]) => ({ key1, key3, key2 })
  );
  
  console.log(result);

I am new to JavaScript and trying to perform a grouping operation on an object-array which looks something as below :

sample = [{key1: "value1", key2: "val1", key3: [{subkey1: "a", subkey2: "b"}]}
{key1: "value2", key2: "val2", key3: [{subkey1: "c", subkey2: "d"}]}
{key1: "value3", key2: "val3", key3: [{subkey1: "e", subkey2: "f"}]}
{key1: "value3", key2: "val3", key3: [{subkey1: "g", subkey2: "h"}]}
{key1: "value3", key2: "val3", key3: [{subkey1: "i", subkey2: "j"}]}
{key1: "value3", key2: "val3", key3: [{subkey1: "k", subkey2: "l"}]]

I tried the following code to group it based on key1 value:

const result = Array.from(sample.reduce((m, {key1, key3, key2}) =>
m.set(key1, [...(m.get(key1) || []), key3, key2]), new Map()), ([key1, key3, key2]) =>
({key1, key3, key2}));

But I get something like this :

[{key1: "value3", key3: [{subkey1: "e", subkey2: "f"},{subkey1: "g", 
subkey2: "h"},{subkey1: "i", subkey2: "j"},{subkey1: "k", subkey2: 
"l"}], key2: **undefined**},.....etc]

expected:

[{key1: "value3", key3: [{subkey1: "e", subkey2: "f"},{subkey1: "g", 
subkey2: "h"},{subkey1: "i", subkey2: "j"},{subkey1: "k", subkey2: 
"l"}],, key2: "val3"},.....etc]

key 2 remains undefined here. Can somebody tell me where I am doing wrong or any other ways to get the result as expected.

Thanks,

1 Answers

You are using Array.from() and Map object wrongly and basically redundant. You are passing 4 arguments to Map.set(), while it takes only 2 arguments.

let m = new Map();
m.set("1","2","3","4"); // essentially just m.set("1","2"), which set the key "1" to value "2";
let array = Array.from(m);
let array2 = Array.from(m,([a,b,c,d])=>{return {a,b,c,d}});
console.log(array);
console.log(array2);

The most important thing is you are not certain on how do you want to group your objects. Your example dose not provide any information since all values except values of key1 are equal. What result do you expect when group by value of key1 while the members of the group have different values for key2 and key3? Please think thoroughly what your expected input and output are. Design a clear data structure.

Related