How to create array of object from nested array?

Question

I have the following array:

const a = [{
    Name: 'martha',
    Surname: 'james',
    Type: 'student',
  },
  {
    Name: 'Meredith',
    Surname: 'Napier',
    Type: 'Teacher',
  },
  {
    Name: 'Julie',
    Surname: 'Schrutt',
    Type: 'student',
  }
]

I need to convert in the following format:

const a = [{
      Type: 'student',
      Names: [{
          Firstname: 'martha',
          Lastname: 'james'
        },
        {
          Firstname: 'Julie',
          Lastname: 'schrutt'
        }
      ],
    },
    {
      Type: 'Teacher',
      Names: [{
        Firstname: 'meredith',
        Lastname: 'Napier'
      }, ],
    }

I have tried lodash grouping, object.entries, array map, reduce, but not able to figure out how to do it.

Does this answer your question? How to group an array of objects by key — pilchard
– pilchard, Commented May 17, 2021 at 9:49

DecPK · Accepted Answer · 2021-05-17 09:55:34Z

4

You can easily achieve this result using reduce in js.

const a = [
  {
    Name: "martha",
    Surname: "james",
    Type: "student",
  },
  {
    Name: "Meredith",
    Surname: "Napier",
    Type: "Teacher",
  },
  {
    Name: "Julie",
    Surname: "Schrutt",
    Type: "student",
  },
];

const result = a.reduce((acc, curr) => {
  const { Name, Surname, Type } = curr;
  const elSearch = acc.find((o) => o.Type === Type);
  if (elSearch) {
    elSearch.Names.push({
      Firstname: Name,
      Lastname: Surname,
    });
  } else {
    acc.push({
      Type,
      Names: [
        {
          Firstname: Name,
          Lastname: Surname,
        },
      ],
    });
  }
  return acc;
}, []);

console.log(result);

You can make the above code snippet shorter if you change the name of the variable while destructuring

const { Name: Firstname, Surname: Lastname, Type } = curr;

and use it as

elSearch.Names.push({ Firstname, Lastname });

const a = [
  { Name: "martha", Surname: "james", Type: "student"},
  { Name: "Meredith", Surname: "Napier", Type: "Teacher"},
  { Name: "Julie", Surname: "Schrutt", Type: "student"},
];

const result = a.reduce((acc, curr) => {
  const { Name: Firstname, Surname: Lastname, Type } = curr;
  const elSearch = acc.find((o) => o.Type === Type);
  if (elSearch) {
    elSearch.Names.push({ Firstname, Lastname });
  } else {
    acc.push({ Type, Names: [{ Firstname, Lastname }] });
  }

  return acc;
}, []);

console.log(result);

edited May 17, 2021 at 9:55

answered May 17, 2021 at 9:47

DecPK

25.4k6 gold badges32 silver badges46 bronze badges

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

2 Comments

minsuga Over a year ago

can you explain what is the need for elSearch?

DecPK Over a year ago

As the end result will be stored in [] you need to find the element in that array so that you can push the element/object in its Names.

amirhosein armantaheri · Accepted Answer · 2021-05-17 10:06:28Z

1

use this method for any group by :

const groupBy = function (list, key) {
  return list.reduce((finalList, item) => {
    const group = (finalList[item[key]] = finalList[item[key]] || [])
    group.push(item)
    return finalList
  }, {})
}

const a = [{
    Name: 'martha',
    Surname: 'james',
    Type: 'student',
  },
  {
    Name: 'Meredith',
    Surname: 'Napier',
    Type: 'Teacher',
  },
  {
    Name: 'Julie',
    Surname: 'Schrutt',
    Type: 'student',
  }
]

console.log(groupBy(a, 'Type'))

answered May 17, 2021 at 10:06

amirhosein armantaheri

611 silver badge3 bronze badges

Comments

LaytonGB · Accepted Answer · 2021-05-17 09:56:05Z

0

Using forEach:

const a = [{
    Name: 'martha',
    Surname: 'james',
    Type: 'student',
  },
  {
    Name: 'Meredith',
    Surname: 'Napier',
    Type: 'Teacher',
  },
  {
    Name: 'Julie',
    Surname: 'Schrutt',
    Type: 'student',
  }
];

const out = [{Type: 'student', Names: []}, {Type: 'teacher', Names: []}];
a.forEach(a => {
  if (a.Type === 'student')
    return out[0].Names.push({
        Firstname: a.Name,
        Lastname: a.Surname,
    });
  out[1].Names.push({
      Firstname: a.Name,
      Lastname: a.Surname,
  });
});

console.log(out);

answered May 17, 2021 at 9:56

LaytonGB

1,4041 gold badge9 silver badges23 bronze badges

Comments

Carlo Moretti · Accepted Answer · 2021-05-17 09:56:47Z

0

Try something like this:

const output = {};    

for(const person of array) {
    if(!output[person.Type]) output[person.Type] = { Type: person.Type, Names:[] };
    output[person.Type].Names.push({ Firstname: person.Name, Lastname: person.Surname });
}

return Object.values(output);

Or in short:

Object.values(array.reduce((pre, curr) => {
    if(!pre[curr.Type]) pre[curr.Type] = { Type: curr.Type, Names:[] };
    pre[curr.Type].Names.push({ Firstname: curr.Name, Lastname: curr.Surname });
    return pre;
} , {}))

answered May 17, 2021 at 9:56

Carlo Moretti

2,2602 gold badges28 silver badges43 bronze badges

Comments

Nikita Mazur · Accepted Answer · 2021-05-17 10:01:27Z

0

const a = [{
    Name: 'martha',
    Surname: 'james',
    Type: 'student',
  },
  {
    Name: 'Meredith',
    Surname: 'Napier',
    Type: 'Teacher',
  },
  {
    Name: 'Julie',
    Surname: 'Schrutt',
    Type: 'student',
  }
]

const types = a.reduce((acc, next) => {
    if (acc.includes(next.Type)) {
    return acc
  }
  return acc.concat(next.Type)
}, [])

const arrayByTypes = types.map((type) => {
    return {
    Type: type,
    Names: a.filter(item => item.Type === type).map(filtered => ({ Name: filtered.Name, Surname: filtered.Surname }))
    }
})

console.log(arrayByTypes)

answered May 17, 2021 at 10:01

Nikita Mazur

1,7971 gold badge8 silver badges15 bronze badges

Comments

Gopi krishna · Accepted Answer · 2021-05-17 10:02:19Z

const data = [{
        Name: 'martha',
        Surname: 'james',
        Type: 'student',
    },
    {
        Name: 'Meredith',
        Surname: 'Napier',
        Type: 'Teacher',
    },
    {
        Name: 'Julie',
        Surname: 'Schrutt',
        Type: 'student',
    }
]

function processData(data) {
    finalMap = new Map();
    data.forEach((obj) => {
        let typeName = obj["Type"];
        let firstName = obj["Name"];
        let lastName = obj["Surname"];
        if (!finalMap[typeName]) {
            finalMap[typeName] = [];
        }
        finalMap[typeName].push({
            "Firstname": firstName,
            "LastName": lastName
        });
    });
    let result = [];
    for (const [key, value] of Object.entries(finalMap)) {
        result.push({
            "Type": key,
            "Names": value
        });
    }
    return result;

}
console.log(processData(data));

Nithish · Accepted Answer · 2021-05-17 15:35:48Z

We can use Array.reduce & Object.values in order to achieve the expected output.

const a = [{Name:'martha',Surname:'james',Type:'student'},{Name:'Meredith',Surname:'Napier',Type:'Teacher'},{Name:'Julie',Surname:'Schrutt',Type:'student'}];

const groupBy = (data, by) => {
  const result = data.reduce((acc, obj) => {
    const key = obj[by];
    const { Type, Name: Firstname, Surname: Lastname } = obj;
    acc[key] = acc[key] || { Type, Names: []};
    acc[key].Names.push({ Firstname, Lastname });
    return acc;
  }, {});
  return Object.values(result);
}

console.log(groupBy(a, "Type"));

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

We can also use Logical nullish assignment (??=) instead of acc[obj[by]] = acc[obj[by]] || { Type, Names: []}

const a = [{Name:'martha',Surname:'james',Type:'student'},{Name:'Meredith',Surname:'Napier',Type:'Teacher'},{Name:'Julie',Surname:'Schrutt',Type:'student'}];

const groupBy = (data, by) => {
  const result = data.reduce((acc, obj) => {
    const key = obj[by];
    const { Type, Name: Firstname, Surname: Lastname } = obj;
    acc[key] ??= { Type, Names: []};
    acc[key].Names.push({ Firstname, Lastname });
    return acc;
  }, {});
  return Object.values(result);
}

console.log(groupBy(a, "Type"));

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

Collectives™ on Stack Overflow

How to create array of object from nested array?

7 Answers 7

2 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

2 Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related