Transforming the api response object into a map containing nested maps with string values

Question

Transforming the api response object into a map containing nested maps with string values

Is there a way to optimize the code below without using loops? Although I prefer not to use loops in my code, the current implementation relies on them. I'm curious if achieving the same result is possible with a different approach.

Code:

ts

private getData(): Observable<any> {
   return this.httpService.get(this.urlConfig.someUrl).pipe(
     map(res => {
       let x = this.recurseMap(res);
     })
   );
 }

 private recurseMap(obj): Map<string, any> {
  const m = new Map<string, any>();
  for (let key in obj) {
     if (typeof obj[key] === 'object') {
      obj[key] = this.recurseMap(obj[key]);
    }
    m.set(key, obj[key]);
  }
  return m;
}

The response for

this.httpService.get(this.urlConfig.someUrl)

will be

{
  "Obj1": {
    "1": "A",
    "2": "B",
    "4": "C",
    "8": "D",
    "16": "E",
    "32": "F",
    "64": "G"
  },
  "Obj2": {
    "0": "H",
    "1": "I",
    "2": "J",
    "3": "K"
  },
  "Obj3": {
    "0": "L",
    "1": "M"
  }
}

The resulting x would hold values like this (map<string,map<string,string>>)

{
  key: "Obj1",
  value: [
    { key: "1", value: "A" },
    { key: "2", value: "B" },
    { key: "4", value: "C" },
    ...
  ]
}

angular typescript

Answer 1

Answer №1

If you're looking for a solution, consider using either loops or recursive functions. However, using both may not be necessary if you prefer to avoid explicit loop usage.

Before diving into the code, keep in mind that your desired outcome should be an array. Having the same key name can lead to the last key overriding all previous ones, so it's advisable to have an array of maps instead.

Another point to note is that altering the function argument at this line

obj[key] = this.recurseMap(obj[key]);

may not be required. This function is meant to map and not transform the input argument.

If you want to avoid explicitly using loops, you can try the following approach:

function rmap(obj) {
    return Object.keys(obj).map(key => {
        let m = new Map();
        if(typeof obj[key] === 'object') {
            return m.set(key, rmap(obj[key]));
        }
        return m.set(key, obj[key]);
    })
}

Alternatively, consider this version without utilizing Map:

function rmap(obj) {
    return Object.keys(obj).map(key => {
        if(typeof obj[key] === 'object') {
            return {key: key, value: rmap(obj[key])};
        } else {
            return {key: key, value: obj[key]}
        }
    })
}

Keep in mind that Object.keys(..).map internally uses a loop, but you don't need to directly handle it.

I hope this provides some assistance :)

Answer 2

If you're looking for a solution, consider using either loops or recursive functions. However, using both may not be necessary if you prefer to avoid explicit loop usage.

Before diving into the code, keep in mind that your desired outcome should be an array. Having the same key name can lead to the last key overriding all previous ones, so it's advisable to have an array of maps instead.

Another point to note is that altering the function argument at this line

obj[key] = this.recurseMap(obj[key]);

may not be required. This function is meant to map and not transform the input argument.

If you want to avoid explicitly using loops, you can try the following approach:

function rmap(obj) {
    return Object.keys(obj).map(key => {
        let m = new Map();
        if(typeof obj[key] === 'object') {
            return m.set(key, rmap(obj[key]));
        }
        return m.set(key, obj[key]);
    })
}

Alternatively, consider this version without utilizing Map:

function rmap(obj) {
    return Object.keys(obj).map(key => {
        if(typeof obj[key] === 'object') {
            return {key: key, value: rmap(obj[key])};
        } else {
            return {key: key, value: obj[key]}
        }
    })
}

Keep in mind that Object.keys(..).map internally uses a loop, but you don't need to directly handle it.

I hope this provides some assistance :)

Transforming the api response object into a map containing nested maps with string values

Answer №1

Similar questions

Angular with Firebase: How to ignore a field in a query

Struggled with setting up the WebSocket structure in typescript

Error: The unit test encountered an issue as it is unable to access the property 'subscribe' of an undefined value

What is the reason for `downlevelIteration` not being enabled by default?

How to determine the presence of 'document' in Typecsript and NextJS

Ensuring the type safety of arguments in TypeScript through conditional checking based on the previous argument

Access the data within a jsonArray using Cypress

Error in MEAN Stack: Unable to access the property 'companyTitle' because it is undefined

Exploring end-to-end testing with NestJS and Guards

What are the steps to conduct a vulnerability scan on an Angular/Node application?

Angular 8 and the conundrum of date parsing issues

Angular + Ionic 4 - Converting String Interpolation to JSON String

Unit testing in Angular 4 with Jasmine Spy: The expectation was for 'New text' but received undefined

The element's type is implicitly set to 'any' as the expression of type 'string' is unable to index the 'PointDto' type

Strategies for resolving the TypeScript error code TS7009?

Failure to trigger the callback for mongoose.connection.once('open') event

Tips for declaring a dynamically sized array in Typescript?

Instructions for creating a cutout on a doughnut chart using ng2-charts

Ways to integrate user input into the header of an Angular HTTP post method

What is the correct way to write a for loop in Angular/JavaScript to initialize a form?