how to map through a property inside an array of arrays of objects

how can I map through a property inside an array of arrays of objects?

to clarify my point here is my code structure, outer array that contains 4 inner arrays - the number shouldn't be four - each inner array has a property title which I want to pick. I want to pick all the tiltle properties inside inner array and get it back in a separate array

Array(4)
0: Array(1)
0: {_id: 'Mc-mi_000000001', title: 'McRoyale', section: {…}, imageSrc: 'McRoyal.png', price: 70, …}
length: 1
[[Prototype]]: Array(0)
1: Array(2)
0: {_id: 'Mc-mi_000000002', title: 'Big Mac', section: {…}, imageSrc: 'Bigmac.png', price: 55, …}
1: {_id: 'Mc-mi_000000003', title: 'Big Tasty', section: {…}, imageSrc: 'Big-tasty-Beef.png', price: 75, …}
length: 2
[[Prototype]]: Array(0)
2: Array(3)
0: {_id: 'Mc-mi_000000022', title: 'McNuggets 6 Pieces', section: {…}, imageSrc: 'McNuggets-6psc.png', price: 50, …}
1: {_id: 'Mc-mi_000000030', title: 'McFries', section: {…}, imageSrc: 'Large-Frise.png', price: 30, …}
2: {_id: 'Mc-mi_000000039', title: 'American Coffee', section: {…}, imageSrc: 'Ame-R-700x474.png', price: 25, …}
length: 3
[[Prototype]]: Array(0)
3: Array(1)
0: {_id: 'Mc-mi_000000041', title: 'Happy Meal Cheeseburger', section: {…}, imageSrc: 'HM-D-Chesseburger.png', price: 35, …}
length: 1
[[Prototype]]: Array(0)
length: 4
[[Prototype]]: Array(0)

how can I put the title property in each inner array into a separate array?

CodePudding user response：

If you want to keep the nested array structure you can use a map function on the inner arrays inside the map function of the outer/main array.

const data = [
  [
    {_id: 'Mc-mi_000000001', title: 'McRoyale'}
  ], [
    {_id: 'Mc-mi_000000002', title: 'Big Mac'},
    {_id: 'Mc-mi_000000003', title: 'Big Tasty'}
  ], [
    {_id: 'Mc-mi_000000022', title: 'McNuggets 6 Pieces'},
    {_id: 'Mc-mi_000000030', title: 'McFries'},
    {_id: 'Mc-mi_000000039', title: 'American Coffee'}
   ]
];

const titleData = data.map(innerArray => innerArray.map(({title}) => title));

console.log(titleData);

/*Expected results:
  [
    [
      "McRoyale"
    ],
    [
      "Big Mac",
      "Big Tasty"
    ],
    [
      "McNuggets 6 Pieces",
      "McFries",
      "American Coffee"
    ]
  ]
*/

CodePudding user response：

You can collect those titles by calling .map nested:

const data = [[{_id: 'Mc-mi_000000001', title: 'McRoyale' }], [{_id: 'Mc-mi_000000002', title: 'Big Mac'},{_id: 'Mc-mi_000000003', title: 'Big Tasty'}], [{_id: 'Mc-mi_000000022', title: 'McNuggets 6 Pieces' },{_id: 'Mc-mi_000000030', title: 'McFries' },{_id: 'Mc-mi_000000039', title: 'American Coffee'}], [{_id: 'Mc-mi_000000041', title: 'Happy Meal Cheeseburger' }]];

const titles = data.map(arr => arr.map(({title}) => title));
console.log(titles);

CodePudding user response：

One possibility is first to flatten your arrays into one then go through it with a map:

[[{title: "a"}, {title: "b"}], [{title: "c"}]].reduce((acc, arr) => ([...acc, ...arr]), []).map(obj => obj.title)