Rearranging JSON data to add id to nested objects

Question

I'm trying to rearrange an incoming JSON object to use in a React component.

The JSON object I'm receiving is jsonData & this is what my current code looks like:

const jsonData = {
  "Jonas": {
    "position": "CTO",
    "employees": [{
      "Sophie": {
        "position": "VP Engineering",
        "employees": [{
            "Nick": {
              "position": "Team Lead",
              "employees": [{
                  "Pete": {
                    "position": "Backend Engineer",
                    "employees": []
                  }
                },
                {
                  "Barbara": {
                    "position": "Fronted Engineer",
                    "employees": []
                  }
                }
              ]
            }
          },
          {
            "Melissa": {
              "position": "Product Manager",
              "employees": []
            }
          }
        ]
      }
    }]
  }
}

const userList = [jsonData]

const formatData = list =>
  list.map(item => {
    let name, position, employees
    for (let key in item) {
      name = key
      position = item[key].position
      employees = item[key].employees ? item[key].employees : []
    }

    return {
      name,
      position,
      employees: employees ? formatData(employees) : employees
    }
  })

console.log(formatData(userList))

I'm trying to add new id to each object & convert the jsonData to an array. I'm getting the output but can't add the id as follows -

[
  {
    "id": 0,
    "name": "Jonas",
    "position": "CTO",
    "employees": [
      {
        "id": 1,
        "name": "Sophie",
        "position": "VP Engineering",
        "employees": [
          {
            "id": 2,
            "name": "Nick",
            "position": "Team Lead",
            "employees": [
              {
                "id": 3,
                "name": "Pete",
                "position": "Backend Engineer",
                "employees": []
              },
              {
                "id": 4,
                "name": "Barbara",
                "position": "Fronted Engineer",
                "employees": []
              }
            ]
          },
          {
            "id": 5,
            "name": "Melissa",
            "position": "Product Manager",
            "employees": []
          }
        ]
      }
    ]
  }
]

How can I add an id to each object of the output?

Answer 1

I think this more better way and solve more nester employees array if add more

const jsonData = {
  "Jonas": {
    "position": "CTO",
    "employees": [{
      "Sophie": {
        "position": "VP Engineering",
        "employees": [{
          "Nick": {
            "position": "Team Lead",
            "employees": [{
              "Pete": {
                "position": "Backend Engineer",
                "employees": []
              }
            },
            {
              "Barbara": {
                "position": "Fronted Engineer",
                "employees": []
              }
            }
            ]
          }
        },
        {
          "Melissa": {
            "position": "Product Manager",
            "employees": []
          }
        }
        ]
      }
    }]
  }
}

const userList = [jsonData]


const newFormat = list => {

  findChildAndAddId(list, 0, list.length)
  return list
}

const findChildAndAddId = (item, count, parentNumber) => {
  if (item && Array.isArray(item)) {
    item.map((value, index) => {
      findChildAndAddId(value, count + index, item.length)
    })
  } else if (item) {
    Object.keys(item).map(key => {
      let value = item[key]
      item.id = count
      item.name = key
      if (value.position) {
        item.position = value.position
      }
      if (value.employees) {
        item.employees = value.employees
      }
      delete item[key]
      if (item.employees) {
        findChildAndAddId(item.employees, count + parentNumber)
      }
    })
  }
}

console.log(newFormat(userList))

Answer 2

You could use Object.assign with a closure over a counter for the id.

function convert(object) {
    const fn = o => (name => Object.assign(
        { id: id++, name },
        o[name],
        { employees: o[name].employees.map(fn)
    }))(Object.keys(o)[0]);

    var id = 0;
    return fn(object);
}

var data = { Jonas: { position: "CTO", employees: [{ Sophie: { position: "VP Engineering", employees: [{ Nick: { position: "Team Lead", employees: [{ Pete: { position: "Backend Engineer", employees: [] } }, { Barbara: { position: "Fronted Engineer", employees: [] } }] } }, { Melissa: { position: "Product Manager", employees: [] } }] } }] } },
    result = convert(data);

console.log(result);

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

Answer 3

Simply add a var id and increment inside loop.

const jsonData = {
  "Jonas": {
    "position": "CTO",
    "employees": [{
      "Sophie": {
        "position": "VP Engineering",
        "employees": [{
            "Nick": {
              "position": "Team Lead",
              "employees": [{
                  "Pete": {
                    "position": "Backend Engineer",
                    "employees": []
                  }
                },
                {
                  "Barbara": {
                    "position": "Fronted Engineer",
                    "employees": []
                  }
                }
              ]
            }
          },
          {
            "Melissa": {
              "position": "Product Manager",
              "employees": []
            }
          }
        ]
      }
    }]
  }
}

const userList = [jsonData]
var id=-1;
const formatData = list =>
  list.map(item => {
    let name, position, employees
    for (let key in item) {
      name = key
      position = item[key].position
      employees = item[key].employees ? item[key].employees : []
    }
   id=id+1;
    return {
      id,
      name,
      position,
      employees: employees ? formatData(employees) : employees
    }
     
  })

console.log(formatData(userList))