How to extract the values of the parent for a specific child within an array of nested JSON objects?

Question

How to extract the values of the parent for a specific child within an array of nested JSON objects?

Take a look at this snapshot of my JSON data.

const info = [{
   "employees": [ 
      {         
         "employee": [
            {
               "name": "Jon",
               "surname": "Smith",
               "leaveRequest": [
                  {
                     "id": "3000",
                     "approver": "Terry"
                  }
               ]
            }],
      },
      {
         "employee": [
            {
               "name": "Mike",
               "surname": "Jones",
               "leaveRequest": [
                  {
                     "id": "1700",
                     "approver": "Mary"
                  }
               ]
            },
         ]
      }
   ]
}];

I'm aiming to establish a way to search by ID within all leave requests and retrieve the employee's name and surname.

For example, if I input the ID "3000", I expect to get an object with the values ["name": "Jon", "surname": "Smith"]

I attempted to apply the solution shared in: How to get immediate parent Id of the child id in array of nested json Object?

This is the implementation I tried:

const locateEmployee = (arr, id) => {
   for (let i = 0; i < arr.length; i++) {
      if (arr[i].id === id) {
         return [];
      } 
      else if (arr[i].employee && arr[i].employee.length) {
         const result = locateEmployee(arr[i].employee, id);

         if (result !== false) {
         if (result.length == 0) 
            result.push({"name": arr[i].name, "surname": arr[i].surname});
            return result;
         }
      }
   }
   return false;
};

console.log(locateEmployee(info, "3000"))

However, the approach in that discussion assumes each child node has the same key 'children', which doesn't suit my situation. I would need to reorganize my JSON structure to follow:

employee
    employee
       employee
          id

Yet, this restructuring isn't logical for my use case. How can I effectively search by ID within all leave requests and fetch the employee's name and surname from the direct parent?

javascript arrays json

Answer 1

Answer №1

To efficiently retrieve data, my recommendation is to recursively traverse through the object and stop when encountering an object with a leaveRequest property.

Once this property is found, remove the leaveRequest and return the remaining part of the object.

Update: This method now supports multiple leave requests per employee.

const data = [{ "employees": [ { "employee": [ { "name": "Jon", "surname": "Smith", "leaveRequest": [ { "id": "2990", "approver": "Kim" } , { "id": "3000", "approver": "Terry" } ] }], }, { "employee": [ { "name": "Mike", "surname": "Jones", "leaveRequest": [  { "id": "1200", "approver": "Jane" }, { "id": "1700", "approver": "Mary" } ] }, ] } ] }];

function findRequest(input, id) {
    if (input.leaveRequest && input.leaveRequest.find(lr => lr.id == id)) {
        // Return everything except the leave request...
        return (({ leaveRequest, ...obj}) => obj)(input);
    }
    for(let k in input) {
        if (input[k] && typeof(input[k]) === 'object') {
            let leaveRequest = findRequest(input[k], id);
            if (leaveRequest) return leaveRequest;
        }
    }
}

let ids = [1700, 3000];
ids.forEach(id => console.log('id: ', id, '\nrequest:', findRequest(data, id)));

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

Answer 2

To efficiently retrieve data, my recommendation is to recursively traverse through the object and stop when encountering an object with a leaveRequest property.

Once this property is found, remove the leaveRequest and return the remaining part of the object.

Update: This method now supports multiple leave requests per employee.

const data = [{ "employees": [ { "employee": [ { "name": "Jon", "surname": "Smith", "leaveRequest": [ { "id": "2990", "approver": "Kim" } , { "id": "3000", "approver": "Terry" } ] }], }, { "employee": [ { "name": "Mike", "surname": "Jones", "leaveRequest": [  { "id": "1200", "approver": "Jane" }, { "id": "1700", "approver": "Mary" } ] }, ] } ] }];

function findRequest(input, id) {
    if (input.leaveRequest && input.leaveRequest.find(lr => lr.id == id)) {
        // Return everything except the leave request...
        return (({ leaveRequest, ...obj}) => obj)(input);
    }
    for(let k in input) {
        if (input[k] && typeof(input[k]) === 'object') {
            let leaveRequest = findRequest(input[k], id);
            if (leaveRequest) return leaveRequest;
        }
    }
}

let ids = [1700, 3000];
ids.forEach(id => console.log('id: ', id, '\nrequest:', findRequest(data, id)));

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

Answer 3

Answer №2

Check out this solution using object-scan:

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

<script type="module>
import objectScan from 'https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bcd3ded6d9dfc891cfdfddd2fc8d84928f928c">[email protected]</a>/lib/index.min.js';

const data = [{ employees: [{ employee: [{ name: 'Jon', surname: 'Smith', leaveRequest: [{ id: '3000', approver: 'Terry' }] }] }, { employee: [{ name: 'Mike', surname: 'Jones', leaveRequest: [{ id: '1700', approver: 'Mary' }] }] }] }];

const find = objectScan(['[*].employees[*].employee[*].leaveRequest[*].id'], {
  abort: true, // stop after first result
  filterFn: ({ value, context }) => value === context, // find the correct id
  rtn: ({ parents }) => parents[2] // return the correct node
});

console.log(find(data, '3000'));
// => { name: 'Jon', surname: 'Smith', leaveRequest: [ { id: '3000', approver: 'Terry' } ] }
</script>

Note: The creator of object-scan is also the author of this code.

Answer 4

Check out this solution using object-scan:

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

<script type="module>
import objectScan from 'https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bcd3ded6d9dfc891cfdfddd2fc8d84928f928c">[email protected]</a>/lib/index.min.js';

const data = [{ employees: [{ employee: [{ name: 'Jon', surname: 'Smith', leaveRequest: [{ id: '3000', approver: 'Terry' }] }] }, { employee: [{ name: 'Mike', surname: 'Jones', leaveRequest: [{ id: '1700', approver: 'Mary' }] }] }] }];

const find = objectScan(['[*].employees[*].employee[*].leaveRequest[*].id'], {
  abort: true, // stop after first result
  filterFn: ({ value, context }) => value === context, // find the correct id
  rtn: ({ parents }) => parents[2] // return the correct node
});

console.log(find(data, '3000'));
// => { name: 'Jon', surname: 'Smith', leaveRequest: [ { id: '3000', approver: 'Terry' } ] }
</script>

Note: The creator of object-scan is also the author of this code.

Answer 5

Answer №3

The data poses a challenge due to its peculiar structure, with single-element arrays within objects and single-keyed objects within arrays. One approach would be to reshape the data into a more logical format, assuming that it does not involve recursion (i.e., employees do not contain other employees).

// Generating a flat array of employees [ employeeA, employeeB, ...
const employees = data[0].employees.map(object => object.employee[0]);

To link a leaveRequest id to the corresponding employee, creating an index is key. It is assumed here that leaveRequest ids are unique.

// Creating an index { leaveIdX: employeeC, leaveIdY: employeeD, ...
const leaveRequestIndex = employees.reduce((index, employee) => {
  employee.leaveRequest.forEach(request => index[request.id] = employee);
  return index;
}, {});

This index allows for a quick lookup from leaveRequest to employee, demonstrated as follows...

// Given a particular leave request ID, find the associated employee
const associatedEmployee = leaveRequestIndex[someLeaveRequestId];

Upon testing with the given data...

// Generating a flat array of employees [ { employee }, { employee }, ...
const employees = data()[0].employees.map(object => object.employee[0]);

// Creating an index { leaveId: { employee }, leaveId: { employee }, ...
const leaveRequestIndex = employees.reduce((index, employee) => {
  employee.leaveRequest.forEach(request => index[request.id] = employee);
  return index;
}, {});

// Test scenario: Which employee submitted the leave request with ID 3001?
const employee = leaveRequestIndex[3001];
const { name, surname } = employee;
console.log(name, surname);


function data() {
  return [{
   "employees": [ 
      {         
         "employee": [
            {
               "name": "Jon",
               "surname": "Smith",
               "leaveRequest": [
                  {
                     "id": "3000",
                     "approver": "Terry"
                  },
                  {
                     "id": "3001",
                     "approver": "Larry"
                  }
               ]
            }],
      },
      {
         "employee": [
            {
               "name": "Mike",
               "surname": "Jones",
               "leaveRequest": [
                  {
                     "id": "1700",
                     "approver": "Mary"
                  }
               ]
            },
         ]
      }
   ]
}];
}

Answer 6

The data poses a challenge due to its peculiar structure, with single-element arrays within objects and single-keyed objects within arrays. One approach would be to reshape the data into a more logical format, assuming that it does not involve recursion (i.e., employees do not contain other employees).

// Generating a flat array of employees [ employeeA, employeeB, ...
const employees = data[0].employees.map(object => object.employee[0]);

To link a leaveRequest id to the corresponding employee, creating an index is key. It is assumed here that leaveRequest ids are unique.

// Creating an index { leaveIdX: employeeC, leaveIdY: employeeD, ...
const leaveRequestIndex = employees.reduce((index, employee) => {
  employee.leaveRequest.forEach(request => index[request.id] = employee);
  return index;
}, {});

This index allows for a quick lookup from leaveRequest to employee, demonstrated as follows...

// Given a particular leave request ID, find the associated employee
const associatedEmployee = leaveRequestIndex[someLeaveRequestId];

Upon testing with the given data...

// Generating a flat array of employees [ { employee }, { employee }, ...
const employees = data()[0].employees.map(object => object.employee[0]);

// Creating an index { leaveId: { employee }, leaveId: { employee }, ...
const leaveRequestIndex = employees.reduce((index, employee) => {
  employee.leaveRequest.forEach(request => index[request.id] = employee);
  return index;
}, {});

// Test scenario: Which employee submitted the leave request with ID 3001?
const employee = leaveRequestIndex[3001];
const { name, surname } = employee;
console.log(name, surname);


function data() {
  return [{
   "employees": [ 
      {         
         "employee": [
            {
               "name": "Jon",
               "surname": "Smith",
               "leaveRequest": [
                  {
                     "id": "3000",
                     "approver": "Terry"
                  },
                  {
                     "id": "3001",
                     "approver": "Larry"
                  }
               ]
            }],
      },
      {
         "employee": [
            {
               "name": "Mike",
               "surname": "Jones",
               "leaveRequest": [
                  {
                     "id": "1700",
                     "approver": "Mary"
                  }
               ]
            },
         ]
      }
   ]
}];
}

How to extract the values of the parent for a specific child within an array of nested JSON objects?

Answer №1

Answer №2

Answer №3

Similar questions

Using ElectronJS requires the usage of the import keyword to load ES Modules

Code snippet for calculating the size of an HTML page using JavaScript/jQuery

Converting a string into an array of JSON objects

Access Azure-Active Directory through cypress tests

Using ajax to process form submissions

Tips for isolating data on the current page:

Does Objective C have a counterpart to the encode() method in JavaScript?

Incorporating jsbi into a TypeScript project while adhering to strict mode

Enhabling Effortless Button Activation & Sustained Navigation State: Integrating Dynamic Navigation in React

javascript utilize jquery to advance saved event

javascript path as the first argument and callback as the last argument

Initiate animation on command with either Jquery or JavaScript

I am interested in checking the dates of the current date and disabling the button if the date falls within that range

A function designed to detect errors based on the parameters supplied as arguments

"The challenge of achieving a transparent background with a PointMaterial texture in ThreeJS

Unable to retrieve observable modifications

Exploring Ways to Retrieve Depth Information within three.js

When working with a JavaScript array of class objects, it may appear as though the array is empty when it

What is the best method for generating an inline keyboard using JSON with several InlineKeyboardButton elements on a single row?

What are the potential consequences if both jackson-jaxrs-json-provider and jersey-media-json-binding.jar are present in the class path located in the /WEB-INF/lib directory?