Buscando una forma más optimizada de hacerlo.
Matrices de recursos:
const users = [ { id: 1, name: 'Vasya', postIds: [11, 22] }, { id: 2, name: 'Petya', postIds: [33] }, { id: 3, name: 'Roma', postIds: [44] }, ]; const posts = [ { id: 11, title: 'How to eat' }, { id: 22, title: 'How to drink' }, { id: 33, title: 'How to breath' }, { id: 44, title: 'How to swim' }, ];Resultado Esperado
const expectedResult = [ { id: 1, name: 'Vasya', posts: [ { id: 11, title: 'How to eat' }, { id: 22, title: 'How to drink' }, ] }, { id: 2, name: 'Petya', posts: [{ id: 33, title: 'How to breath' },] }, { id: 3, name: 'Roma', posts: [{ id: 44, title: 'How to swim' }] }, ]Qué estoy haciendo:
const expectedOutput = users.map(({id,name,postIds})=>({id,name,posts:posts.filter(post=>postIds.includes(post.id))}))El problema es que estoy haciendo demasiadas iteraciones (mapa, filtro e incluye), pensando que existe la posibilidad de hacerlo de una manera más bonita. Será agradecido por cualquier idea para refactorizar.
Su solución parece estar bien, pero si quisiera reducir la complejidad, primero puede crear una tabla de búsqueda de publicaciones y luego mapearla.
Aquí, usando un Map para la tabla de búsqueda, llamadas map() anidadas para iterar sobre cada matriz de objeto/postIds, y un ?? marque para devolver un objeto con solo id si no se encuentra una publicación coincidente.
const users = [ { id: 1, name: 'Vasya', postIds: [11, 22] }, { id: 2, name: 'Petya', postIds: [33] }, { id: 3, name: 'Roma', postIds: [44] }, ]; const posts = [ { id: 11, title: 'How to eat' }, { id: 22, title: 'How to drink' }, { id: 33, title: 'How to breath' }, { id: 44, title: 'How to swim' }, ]; const postsMap = new Map(posts.map((post) => [post.id, post])); const result = users.map(({ postIds, ...user }) => ({ ...user, posts: postIds.map((id) => postsMap.get(id) ?? { id }), })); console.log(result); .as-console-wrapper { max-height: 100% !important; top: 0; }