JS get all the arrays within an array

Question

I have an object that looks like the following:

const test = {
  leagues: [
    {
      timezone: "GMT",
      date: "1/2/2",
      premierLeague: [
        { name: "Liverpool", age: 1892 },
        { name: "Manchester Utd", age: 1878 }
      ],
      laLiga: [
        {
          team: "Real Madrid",
          stadium: "Bernabeu"
        },
        {
          team: "Barcelona",
          stadium: "Camp Nou"
        }
      ]
    }
  ]
};

and I want the result to look like

const result = [
  { name: "Liverpool", age: 1892 },
  { name: "Manchester Utd", age: 1878 },
  {
    team: "Real Madrid",
    stadium: "Bernabeu"
  },
  {
    team: "Barcelona",
    stadium: "Camp Nou"
  }
];

I have tried to use flat() but am having trouble getting the arrays within the leagues. The result will be dynamic so I need to be able to get all the arrays within leagues. Can anyone point me in the correct direction to do this?

Do you really want that result? It's objects of totally different shapes in the same array. Don't do that. — Bergi, May 09 '22 at 20:19
Check the solutions here, it may help https://stackoverflow.com/questions/27266550/how-to-flatten-nested-array-in-javascript — Evren, May 09 '22 at 20:20
@Evren Not sure how that can help, please be more specific how you think it will help — Ruan Mendes, May 09 '22 at 20:21

Jared Smith · Answer 1 · 2022-05-09T20:47:12.390

3

If your object structure doesn't go an deeper than that, this long one-liner should work:

const result = test.leagues.reduce((arr, obj) => Object.values(val).reduce((innerArr, val) => Array.isArray(val) ? innerArr.concat(val) : innerArr, arr), []);

Somewhat ungolfed:

const result = test.leagues.reduce((arr, obj) => {
  return Object.values(val).reduce((innerArr, val) => {
    return Array.isArray(val)
      ? innerArr.concat(val) 
      : innerArr
  }, arr);
}), []);

edited May 09 '22 at 20:47

answered May 09 '22 at 20:23

Jared Smith

19,721
5
45
83

1

Mixing `reduce` with `forEach` and `push` is quite ugly, don't you think? – Bergi May 09 '22 at 20:30
@Bergi you're not wrong. I fired that off between meetings – Jared Smith May 09 '22 at 20:40
1

Thanks! I'd still prefer @Juan's `for`+`push` or my `flatMap` over `reduce`, but at least it's consistent now :-) – Bergi May 09 '22 at 20:46
I almost deleted my answer since I saw this and @Bergi's . I still posted it in because the double loop is the easiest one to scan and quickly know what is happening. I do know it is not as elegant – Ruan Mendes May 09 '22 at 21:08
@JuanMendes don't sweat it. Elegant is a matter of degrees. – Jared Smith May 09 '22 at 22:01

score 2 · Accepted Answer · edited May 10 '22 at 07:42

2

You might be looking for

const result = test.leagues.flatMap(league =>
  Object.values(league).filter(Array.isArray).flat()
);

edited May 10 '22 at 07:42

peter flanagan

9,195
26
73
127

answered May 09 '22 at 20:25

Bergi

630,263
148
957
1,375

thanks for this, but as I said the response will be dynamic so can't hard code names of the arrays – peter flanagan May 09 '22 at 20:25
@peterflanagan Oh I thought you would know the structure, and only the values in the arrays would be dynamic… but if you don't know the names of array-valued properties I have updated my answer. It still assumes `test.leagues` to be an array of objects with possibly-array-valued properties, is that right? Not arbitrarily nested? – Bergi May 09 '22 at 20:29

Ruan Mendes · Answer 3 · 2022-05-10T14:58:16.967

This sounds weird, you'll end up with objects of different shapes in the same array. I'm not sure how you'll deal with that.

It looks like you're trying to concatenate every value of test.leagues that is itself an array.

const test = {
  leagues: [{
    timezone: "GMT",
    date: "1/2/2",
    premierLeague: [{
        name: "Liverpool",
        age: 1892
      },
      {
        name: "Manchester Utd",
        age: 1878
      }
    ],
    laLiga: [{
        team: "Real Madrid",
        stadium: "Bernabeu"
      },
      {
        team: "Barcelona",
        stadium: "Camp Nou"
      }
    ]
  }]
};


const output = [];
for (const league of test.leagues) {
  for (const key in league) {
    if (Array.isArray(league[key])) {
      // Push each element in `league[key]` onto `output`
      // so we don't have to flatten it later
      output.push(...league[key]);
    }
  }
}
console.log({
  output
});

@peterflanagan Fixed by spreading the arrays as we push them: `output.push(...league[key]);` — Ruan Mendes, May 10 '22 at 14:03

score 0 · Answer 4 · answered May 09 '22 at 20:30

Well, I'm also adding my 2 cents over here. I do agree with everyone else. See if this works:

const test = {
  leagues: [
    {
      timezone: "GMT",
      date: "1/2/2",
      premierLeague: [
        { name: "Liverpool", age: 1892 },
        { name: "Manchester Utd", age: 1878 }
      ],
      laLiga: [
        {
          team: "Real Madrid",
          stadium: "Bernabeu"
        },
        {
          team: "Barcelona",
          stadium: "Camp Nou"
        }
      ]
    }
  ]
};

let finalArray = [];

function recursiveArr(obj, arrayToPush) {
    for(const [key, val] of Object.entries(obj)) {
    if(Array.isArray(obj[key])) {
      arrayToPush.push(obj[key]);
      continue;
    }
    
    const type = typeof obj[key];
    
    if(type === "object") {
       recursiveArr(obj[key], arrayToPush);
    }
  }
}

recursiveArr(test.leagues, finalArray);

console.log(finalArray.flat())

JS get all the arrays within an array

4 Answers4