Как с помощью reduce() создать составной массив объектов?

Question

[Михаил Корольков]

Мне надо сделать массив, где сначала идет элемент из grop, а затем его дети из city, где id совпадает. Через reduce().

Вот, что у меня получилось:

const grop = [
    {name: 'merseded', groupName: 'avto', idParent: '11' }, 
    {name: 'bmv', groupName: 'avto', idParent: '20' } 
   ] 
const city = [{name: 'test1', idMain: '11'},
              {name: 'test2', idMain: '11'}, 
              {name: 'test3', idMain: '20'},
              {name: 'test4', idMain: '11'}]

const resalt = [...grop, ...city]
console.log(resalt)
const resaltCity = resalt.reduce((acu, cur) => {
     const findSuperGroup = acu.find(el => el.groupName  == cur.groupName);
   
    if (findSuperGroup){
         return [...acu.filter(item => item.groupName !== null ), {...cur}]
       } else {
           
       }
        return [...acu, {...cur}];
}, []);

console.log('resaltCity', resaltCity)

А должно быть:

const gropResalt = [
  { name: 'merseded', groupName: 'avto', idParent: '11' },
  { name: 'test', idMain: '11' },
  { name: 'test', idMain: '11' },
  { name: 'test', idMain: '11' },
  { name: 'bmv', groupName: 'avto', idParent: '20' },
  { name: 'test', idMain: '20' }
]

Answer 1

[0xD34F]

Object.values(city.reduce(
  (acc, n) => (acc[n.idMain]?.push(n), acc),
  Object.fromEntries(grop.map(n => [ n.idParent, [ n ] ]))
)).flat()

или

grop.flatMap(n => [ n, ...city.filter(m => m.idMain === n.idParent) ])

Answer 2

[Сергей Соколов]

const result = grop.reduce((acc, el) => acc.concat(el, city.filter((c) => c.idMain === el.idParent)), []);

result

/*
[
  {
    "name": "merseded",
    "groupName": "avto",
    "idParent": "11"
  },
  {
    "name": "test1",
    "idMain": "11"
  },
  {
    "name": "test2",
    "idMain": "11"
  },
  {
    "name": "test4",
    "idMain": "11"
  },
  {
    "name": "bmv",
    "groupName": "avto",
    "idParent": "20"
  },
  {
    "name": "test3",
    "idMain": "20"
  }
]
*/