Array of JSON objects nested in array of JSON objects

Question

I have a JSON array of objects of the format

var employees = 
[
  {
    "employee1": "employee1",
    "Details": [
      {
        "title": "Software Engineer",
        "EmployeeId": 451
      }
    ]
  },
  {
    "employee2": "employee2",
    "Details": []
  },
  {
    "employee3": "employee3",
    "Details": [
      {
        "title": "Test analyst",
        "EmployeeId": 453
      }
    ]
  },
  {
    "employee4": "employee4",
    "Details": [
      {
        "title": "Software engineer",
        "EmployeeId": 487
      },
      {
        "title": "Architect",
        "EmployeeId": 500
      }
    ]
  }
]

What's the best way to get the EmployeeIds?

Expected output:

[451,453,487,500]

When I used:

console.log(Object.assign({}, ...employees).Details.map(t=>t.EmployeeId))

It is returning the result as:

[487,500]

Is there a way to concatenate other employee Ids in the result?

Answer 1

Firstly - it's not JSON, just an array. Secondly, use flatMap and map like so:

 var employees = [{ "employee1": "employee1", "Details": [{ "title": "Software Engineer", "EmployeeId": 451 }] }, { "employee2": "employee2", "Details": [] }, { "employee3": "employee3", "Details": [{ "title": "Test analyst", "EmployeeId": 453 }] }, { "employee4": "employee4", "Details": [{ "title": "Software engineer", "EmployeeId": 487 }, { "title": "Architect", "EmployeeId": 500 } ] } ]; var ids = employees.flatMap(({ Details }) => Details.map(({ EmployeeId }) => EmployeeId)); console.log(ids); 

Polyfill without flatMap - courtesy of MDN's alternative :

 var employees = [{ "employee1": "employee1", "Details": [{ "title": "Software Engineer", "EmployeeId": 451 }] }, { "employee2": "employee2", "Details": [] }, { "employee3": "employee3", "Details": [{ "title": "Test analyst", "EmployeeId": 453 }] }, { "employee4": "employee4", "Details": [{ "title": "Software engineer", "EmployeeId": 487 }, { "title": "Architect", "EmployeeId": 500 } ] } ]; var ids = employees.reduce((acc, { Details }) => acc.concat(Details.map(({ EmployeeId }) => EmployeeId)), []); console.log(ids); 

Answer 2

Instead of using flatMap which has questionable support (though I think it's a great answer, mind you) here's an answer that relies on reduce and the spread operator :

employees
  .reduce((a, v) => 
   ( v.Details && a.push(...v.Details.map(o=>o.EmployeeId)), a)
  , []);

---

without the spread , using flat

employees
  .reduce((a, v) => 
   ( v.Details && a.push(v.Details.map(o=>o.EmployeeId)), a.flat(1))
  , []);

---

without spread or flat , utilizing [].concat.apply([], arr)

employees
  .reduce((a, v) => 
   ( v.Details && a.push(v.Details.map(o=>o.EmployeeId)), [].concat.apply([], a))
  , []);

---

Examples of these Working:

 var employees=[{employee1:"employee1",Details:[{title:"Software Engineer",EmployeeId:451}]},{employee2:"employee2",Details:[]},{employee3:"employee3",Details:[{title:"Test analyst",EmployeeId:453}]},{employee4:"employee4",Details:[{title:"Software engineer",EmployeeId:487},{title:"Architect",EmployeeId:500}]}]; let _ // setup our methods and name them ( array_concat = employees.reduce((a, v) => ( v.Details && a.push(v.Details.map(o=>o.EmployeeId)), [].concat.apply([], a)), []) ) .name = "Using Array#concat", ( spread = employees.reduce((a, v) => ( v.Details && a.push(...v.Details.map(o=>o.EmployeeId)), a), []) ) .name = "Using Spread Operator", ( flat = employees.reduce((a, v) => ( v.Details && a.push(v.Details.map(o=>o.EmployeeId)), a.flat(1)), []) ) .name = "Using Flat", // test if it works! isCorrect = (arr, json = JSON.stringify(arr), {name} = arr) => console.info( json === "[451,453,487,500]" ? `${name} Passed!` : `${name} Failed`); isCorrect(array_concat); isCorrect(spread); isCorrect(flat); 

Answer 3

You could try a nested reduce approach. This works quickly and doesn't make use of anything ES5 or higher.

 var employees = [{ "employee1": "employee1", "Details": [{ "title": "Software Engineer", "EmployeeId": 451 }] }, { "employee2": "employee2", "Details": [] }, { "employee3": "employee3", "Details": [{ "title": "Test analyst", "EmployeeId": 453 }] }, { "employee4": "employee4", "Details": [{ "title": "Software engineer", "EmployeeId": 487 }, { "title": "Architect", "EmployeeId": 500 } ] } ]; var ids = employees.reduce(function(a, b) { return b.Details.reduce(function(c, d) { c.push(d.EmployeeId); return c; }, a); }, []); console.log(ids);