How to find specific data in nested object structure in Javascript?

Question

I shared a piece of code which demonstrate I have two types of response. If you take a look at the code below you will find out the response of a service result would be slightly different. In the first type, you have a single data but in the second one, this data has another data in itself.

{
    "data": {
        "hasError": false,
        "developerMessage": null,
        "totalCount": 43
    },
    "hasError": false,
    "developerMessage": null
}

Or:

{
    "data": {
        "hasError": false,
        "developerMessage": null,
        "data": {
            "hasError": false,
            "developerMessage": null,
            "totalCount": 43
        },
        "totalCount": 43
    },
    "hasError": false,
    "developerMessage": null
}

So to handle this predicament I had to first check the result of response and split it into two blocks. The big problem is that for reasons I can't explain here, this hierarchy might expand and I have three data, but what we're sure of is that the data in the response is always the deepest. (The third item in this example)

   return this.httpWrapperService.get(url + tableNameWithSlash, {
            params: params, additionalOptions: {spinnerEnabled: false}
          }).then((result: any) => {

            if (result.data.data) {
              // code
              return [...result.data.data];
            } 

            else if (result.data) {
              // code
              return [...result.data];
            }

          });

I was wondering if there is a better solution to handle this dynamic response.

I think it's a sign that the overall architecture needs to be looked at if you're planning on nesting data like that. Are you able to return everything in a data array and give each object a property that references its parent? — anthonyb
– anthonyb, Commented Jul 3, 2022 at 13:44
This issue comes from the hierarchy model and there is no choice but to find the deepest data. — Sasan
– Sasan, Commented Jul 3, 2022 at 14:30
Are you concerned about strongly typing your function or are you satisfied with the "any" type? — anthonyb
– anthonyb, Commented Jul 3, 2022 at 15:01
The array spread seems wrong, all your data properties have objects as values. — Bergi
– Bergi, Commented Jul 3, 2022 at 15:14

Donald Duck · Accepted Answer · 2022-07-03 15:37:25Z

1

You could use recursion to make a solution that works for any depth, e.g. data being on the 4th layer

    .then((result: any) => {
        const findData = (response: any) => {
           return response.data ? findData(response.data):response;
        }
         return [...findData(result.data)];

          });

edited Jul 3, 2022 at 15:37

answered Jul 3, 2022 at 14:53

Donald Duck

843 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Bergi Over a year ago

You should test for the existence of response.data as the base case, not response.data.data

Bergi Over a year ago

If you know there's at least one level of nesting, rather call findData(result.data)

Donald Duck Over a year ago

Good point, updated my answer

Collectives™ on Stack Overflow

How to find specific data in nested object structure in Javascript?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related