Merging Nested Objects with same key into single Object in JavaScript

Question

This is my Array in JavaScript, I want to merge teacher object below into combine single object to perform operations further.

const data = [
  {
    name: "ab",
    class: 1,
    grade: "A",
    teacher: {
      teacherName: "tab",
      age: 34,
      school: "ab pblc scl"
    }
  },
  {
    name: "cd",
    class: 2,
    grade: "B",
    teacher: {
      teacherName: "efg",
      age: 35,
      school: "cd pblc scl"
    }
  }
];

This is my Expected output. Here teacher object is combine with other single objects. Any idea how can I do this ?

const data = [
  {
    name: "ab",
    class: 3,
    grade: "B",
    teacherName: "kio",
    age: 38,
    school: "ab pblc scl"

  },
  {
    name: "de",
    class: 2,
    grade: "B",
    teacherName: "tde",
    age: 36,
    school: "de pblc scl"
   }

 }
];

Any help will be appreciated

Nina Scholz · Accepted Answer · 2019-07-10 12:55:45Z

You could destructure teacher and spread the rest of the array with teacher to a new object.

Methods:

destructuring assignment to teacher,

result = data.map(({ teacher, ...object }) => ({ ...object, ...teacher }));
                   ^ ^^^^^^^            ^

rest in object destructuring for getting all other properties,

result = data.map(({ teacher, ...object }) => ({ ...object, ...teacher }));
                   ^          ^^^^^^^^^ ^

spread syntax ... for getting copies of own enumerable properties of the object

result = data.map(({ teacher, ...object }) => ({ ...object, ...teacher }));
                                               ^ ^^^^^^^^^  ^^^^^^^^^^ ^

const
    data = [{ name: "ab", class: 1, grade: "A", teacher: { teacherName: "tab", age: 34, school: "ab pblc scl" } }, { name: "cd", class: 2, grade: "B", teacher: { teacherName: "efg", age: 35, school: "cd pblc scl" } }],
    result = data.map(({ teacher, ...object }) => ({ ...object, ...teacher }));

console.log(result);

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

Rahul Rana · Accepted Answer · 2019-07-10 12:45:38Z

-1

You can use spread operator to do it.

const data = [
  {
    name: "ab",
    class: 1,
    grade: "A",
    teacher: {
      teacherName: "tab",
      age: 34,
      school: "ab pblc scl"
    }
  },
  {
    name: "cd",
    class: 2,
    grade: "B",
    teacher: {
      teacherName: "efg",
      age: 35,
      school: "cd pblc scl"
    }
  }
];

const newData = data.map(d => {
  const dClone = Object.assign({},d);
  delete dClone.teacher;
  return {
    ...dClone,
    ...d.teacher
  }
})

console.log(newData);

answered Jul 10, 2019 at 12:45

Rahul Rana

4652 silver badges8 bronze badges

Collectives™ on Stack Overflow

Merging Nested Objects with same key into single Object in JavaScript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related