Extract a property inside of an array of objects which is inside of another array of objects and have the result as an array of strings

Question

I have a TypeScript array of objects with the following structure:

const surveyResponses: any[] = [ {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Bla'}]}, {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Blo'}]} ];

I would like to extract the response property inside of the responses array and have them as a single array of strings.

Expected result: ['Bla', 'Blo']

I have tried to follow these advices:

I have tried to use reduce without luck:

responses.reduce((a, o) => (o.responses.map(r => r.response) && a.push(o.responses.map(r => r.response)), a), []);

I have tried to use map without luck:

responses.map(r => r.responses).map(r => r.map(r => r.response)); Result: [["Bla"], ["Blo"]]

Any help would be appreciated.

CertainPerformance · Accepted Answer · 2020-11-22 00:43:46Z

Use flatMap to take the responses array, take their response strings, and combine them:

const surveyResponses = [ {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Bla'}]}, {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Blo'}]} ]; const result = surveyResponses.flatMap( item => item.responses.map( ({ response }) => response ) ); console.log(result);

Also note that using any defeats the whole point of using TypeScript, since it effectively disables type-checking for that expression. When possible, either let TS infer the type of an expression automatically, or denote the type yourself manually when you need to. (In this case, TS can infer the type of surveyResponses automatically just fine)

If you can't use flatMap, you can spread into concat:

const surveyResponses = [ {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Bla'}]}, {createdAt: new Date(), responses: [{questionId: 'input1', response: 'Blo'}]} ]; const result = [].concat(...surveyResponses.map( item => item.responses.map( ({ response }) => response ) )); console.log(result);

Thanks for your quick response, it works perfectly. One additional question, how can we achieve this when flatMap() is not an available option in our environment? About the types, thanks for the tip, I have added an interface now.

Rubydesic · Accepted Answer · 2020-11-22 06:38:03Z

In my opinion, an even simpler option using flatMap. You can always polyfill it if its not available.

const result = surveyResponses.flatMap(r => r.responses).map(r => r.response) console.log(result)

Collectives™ on Stack Overflow

Extract a property inside of an array of objects which is inside of another array of objects and have the result as an array of strings

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related