I'm trying to take an array of objects like this

[
  {
    "id": "uniqueParentId1",
    "children": [
      {
        "childProp1": "test1",
        "childProp2": "test3"
      }
    ]
  },
  {
    "id": "uniqueParentId2",
    "children": [
      {
        "childProp1": "somevals",
        "childProp2": "other vals"
      },
      {
        "childProp1": "somevals 1",
        "childProp2": "other vals 1"
      }
    ]
  }
]

And return an array of all the children combined, with each child object having an additional value, the "id" of the parent.

Above examples, result.

[
  {
    "parentId": "uniqueParentId1",
    "childProp1": "test1",
    "childProp2": "test3"
  },
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals",
    "childProp2": "other vals"
  }
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals 1",
    "childProp2": "other vals 1"
  }
]

I'm just not sure how to approach this. I'm familiar with flattening and array of arrays. But I'm only able to get the output as an array of the original children without adding the parentId

I'm trying to take an array of objects like this

[
  {
    "id": "uniqueParentId1",
    "children": [
      {
        "childProp1": "test1",
        "childProp2": "test3"
      }
    ]
  },
  {
    "id": "uniqueParentId2",
    "children": [
      {
        "childProp1": "somevals",
        "childProp2": "other vals"
      },
      {
        "childProp1": "somevals 1",
        "childProp2": "other vals 1"
      }
    ]
  }
]

And return an array of all the children combined, with each child object having an additional value, the "id" of the parent.

Above examples, result.

[
  {
    "parentId": "uniqueParentId1",
    "childProp1": "test1",
    "childProp2": "test3"
  },
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals",
    "childProp2": "other vals"
  }
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals 1",
    "childProp2": "other vals 1"
  }
]

I'm just not sure how to approach this. I'm familiar with flattening and array of arrays. But I'm only able to get the output as an array of the original children without adding the parentId

• javascript
• arrays
• node.js
• lambda

• shorter titles that explain more FTW – DarkMukke Commented Aug 17, 2017 at 16:28
• dont know how to explain it any shorter – user1738539 Commented Aug 17, 2017 at 16:29
• eg Howto use Map reduce to reorganise an array of objects. As soon as you mentioned: parents, children, id's, it thought i was reading your description, not your title. – DarkMukke Commented Aug 17, 2017 at 16:32

3 Answers 3

This should do it:

var values = [{
    "id": "uniqueParentId1",
    "children": [{
      "childProp1": "test1",
      "childProp2": "test3"
    }]
  },
  {
    "id": "uniqueParentId2",
    "children": [{
        "childProp1": "somevals",
        "childProp2": "other vals"
      },
      {
        "childProp1": "somevals 1",
        "childProp2": "other vals 1"
      }
    ]
  }
];

var result = values.map(value =>
  value.children.map(child => ({ parentId: value.id, ...child }))
).flat();

console.log(result);

A breakdown of the code:

child => ({ parentId: value.id , ...child })

Takes an object and returns a new object with the parentId property and all of the properties in child.

Input:

{
    "childProp1": "somevals",
    "childProp2": "other vals"
}

Output:

{
    "parentId": "uniqueParentId2"
    "childProp1": "somevals",
    "childProp2": "other vals"
}

Next function:

value =>
    value.children.map(child => ({ parentId: value.id, ...child }))

Takes an object named value, applies the function above to each of the array elements in value.children, and returns an array of the results.

Next:

values.map(.....)

Applies the function above to each of the elements in values and returns an array of the results.

At this point, the result of this .map() call is an array like the following, with one element for each element of the original array:

[
  [
    {
      "parentId": "uniqueParentId1",
      "childProp1": "test1",
      "childProp2": "test3"
    }
  ],
  [
    {
      "parentId": "uniqueParentId2",
      "childProp1": "somevals",
      "childProp2": "other vals"
    },
    {
      "parentId": "uniqueParentId2",
      "childProp1": "somevals 1",
      "childProp2": "other vals 1"
    }
  ]
]

So the last thing we do is flatten flatten this array with .flat().

const arr = [
  {
    "id": "uniqueParentId1",
    "children": [
      {
        "childProp1": "test1",
        "childProp2": "test3"
      }
    ]
  },
  {
    "id": "uniqueParentId2",
    "children": [
      {
        "childProp1": "somevals",
        "childProp2": "other vals"
      },
      {
        "childProp1": "somevals 1",
        "childProp2": "other vals 1"
      }
    ]
  }
];
let combined = [];
arr.forEach((parent) => {
  const {id, children} = parent;
  children.forEach((child) => {
    Object.assign(child, {
      parentId: id
    });
    combined.push(child);
  });
});

console.log(combined);
/*
[
  {
    "parentId": "uniqueParentId1",
    "childProp1": "test1",
    "childProp2": "test3"
  },
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals",
    "childProp2": "other vals"
  }
  {
    "parentId": "uniqueParentId2",
    "childProp1": "somevals 1",
    "childProp2": "other vals 1"
  }
]
*/

If you apply a more functional approach, you can do something like:

const results = [] //Array we want to store all data in
arr.forEach(e => {
  const {id: parentId} = e  //Extract id as variable parentId

  // Store all the children objects with the added key
  e.children.forEach(c => results.push(Object.assign({parentId}, c)))
})