Sankar S
Sankar S

Reputation: 227

How to filter array of object inside the array of the object type in JavaScript?

I'm facing one issue with one of the API responses, I have a response something like the below one.

[
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "US"}, {type: "County", countyName: "US"}, {type: "County", countyName: "US"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "German"}, {type: "County", countyName: "German"}, {type: "County", countyName: "German"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "Japan"}, {type: "County", countyName: "German"}, {type: "County", countyName: "German"}]},
]

it looks like an array of objects inside that have countries also the arrays of the object type. I need all the countyName in a single array for all the array of elements. like the below one type,

newNames = [US, German, Japan];

I tried something like this. but I couldn't able to get the output. can you please help me to do this? thank you all.

let newNames = this.selectedStateList.filter(item => item.countries.forEach(item => item.countries)).map(ele => ele.countries.forEach(item => item.countries))

Upvotes: 1

Views: 764

Answers (4)

Hassan Imam
Hassan Imam

Reputation: 22574

You can look through each countries object and add your data in a Set to get unique country.

const data = [ {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "US"}, {type: "County", countyName: "US"}, {type: "County", countyName: "US"}]}, {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "German"}, {type: "County", countyName: "German"}, {type: "County", countyName: "German"}]}, {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "Japan"}, {type: "County", countyName: "German"}, {type: "County", countyName: "German"}]}, ],
      result = Array.from(data.reduce((r, {countries}) => {
        countries.forEach(({countyName}) => r.add(countyName));
        return r;
      }, new Set()));
console.log(result);

Upvotes: 1

GigaWarTrex
GigaWarTrex

Reputation: 145

You could iterate over the given response (array of objects), then reference the countries element and get it's first entry as it is also an array of objects:

var input = [
    { type: "StateCountry", state: "AL", countries: [{ type: "County", countyName: "US" }] },
    { type: "StateCountry", state: "AL", countries: [{ type: "County", countyName: "German" }] },
    { type: "StateCountry", state: "AL", countries: [{ type: "County", countyName: "Japan" }] },
]
let output = []

for (const obj of input) {
    output.push(obj.countries[0].countyName)
}
console.log(output)

Upvotes: 0

knicholas
knicholas

Reputation: 530

Would something like this work?

const arr = [
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "US"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "German"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "Japan"}]}
]


const result = arr.reduce((acc,val)=>{
acc.push(val.countries[0].countyName)
return acc
},[] )

console.log(result)

Upvotes: 0

CertainPerformance
CertainPerformance

Reputation: 371193

You need .maps, not .forEach - .maptransforms each element of an array, butforEach` does not return anything.

After getting an array of arrays of country names, you can flatten with .flat() - or you can put them together and use flatMap instead.

const input = [
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "US"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "German"}]},
  {type: "StateCountry", state: "AL", countries: [{type: "County", countyName: "Japan"}]},
];

const output = input.flatMap(
  obj => obj.countries.map(
    country => country.countyName
  )
);
console.log(output);

Upvotes: 0

Related Questions