tengo esta matriz
[ { id: "2b077c3c-9d3a-48ba-9217-f5d3d28c2dfc", description: "Response #1", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" }, responses: [ { id: "69442cb1-7de7-4f2d-9c8b-d6689fa1d007", description: "Response #2", media: "b414e44f-7371-4cef-b0d9-d240e55b0ed1.jpg", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" } } ] }, { id: "d8271620-9937-4815-bd35-acad62d85f53", description: "Response #3", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" }, responses: [ { id: "05acce0a-8f7e-4ccd-9bbc-3337e4faa8ca", description: "Response #4", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" } } ] } ]Y quiero cambiar el nombre de las propiedades a
[ { id: "2b077c3c-9d3a-48ba-9217-f5d3d28c2dfc", name: "User — Response #1", children: [ { id: "69442cb1-7de7-4f2d-9c8b-d6689fa1d007", name: "User — Response #2" } ] }, { id: "d8271620-9937-4815-bd35-acad62d85f53", name: "User — Response #3", children: [ { id: "05acce0a-8f7e-4ccd-9bbc-3337e4faa8ca", name: "User — Response #4", } ] } ]He intentado resolver esto con mapa y recursividad.
function mapArray(array) { return array.map(({ id, description, user: { name }, responses }) => { if (responses !== undefined) { return mapArray(responses); } return { id, name: `${name} — ${description}`, children: responses }; }); } Pero la matriz se anida y los niños no están undefined .
[ [ { id: '69442cb1-7de7-4f2d-9c8b-d6689fa1d007', name: 'User — Response #2', children: undefined } ], [ { id: '05acce0a-8f7e-4ccd-9bbc-3337e4faa8ca', name: 'User — Response #4', children: undefined } ] ] Tenga en cuenta que las responses tienen una profundidad indefinida.
¿Dónde me equivoqué? Gracias
Estás muy cerca. Solo 1 cambio de línea dentro de las condiciones si deberían solucionarlo.
function mapArray(array) { return array.map(({ id, description, user: { name }, responses }) => { if (responses !== undefined) { responses = mapArray(responses); } return { id, name: `${name} — ${description}`, children: responses }; }); }Samridh diagnosticó el problema y le proporcionó una solución útil. Si está buscando una versión un poco más declarativa de la misma idea, podría escribir la función de esta manera:
const mapArray = (array) => array .map ( ({id, description, user: {name}, responses}) => ({ id, name: `${name} - ${description}`, ...(responses ? {children: mapArray (responses)} : {}) }) ) const input = [{id: "2b077c3c-9d3a-48ba-9217-f5d3d28c2dfc", description: "Response #1", user: {id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User"}, responses: [{id: "69442cb1-7de7-4f2d-9c8b-d6689fa1d007", description: "Response #2", media: "b414e44f-7371-4cef-b0d9-d240e55b0ed1.jpg", user: {id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User"}}]}, {id: "d8271620-9937-4815-bd35-acad62d85f53", description: "Response #3", user: {id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User"}, responses: [{id: "05acce0a-8f7e-4ccd-9bbc-3337e4faa8ca", description: "Response #4", user: {id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User"}}]}] console .log (mapArray (input)) .as-console-wrapper {max-height: 100% !important; top: 0}Puede que me parezca un poco feo pero es un suplente. También Array.map() devuelve una matriz, por lo que es obvio que está anidada.
var obj = [ { id: "2b077c3c-9d3a-48ba-9217-f5d3d28c2dfc", description: "Response #1", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" }, responses: [ { id: "69442cb1-7de7-4f2d-9c8b-d6689fa1d007", description: "Response #2", media: "b414e44f-7371-4cef-b0d9-d240e55b0ed1.jpg", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" } } ] }, { id: "d8271620-9937-4815-bd35-acad62d85f53", description: "Response #3", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" }, responses: [ { id: "05acce0a-8f7e-4ccd-9bbc-3337e4faa8ca", description: "Response #4", user: { id: "3ae5967a-cdfa-4047-aff9-b0c95d2d4da4", name: "User" } } ] } ]; var newObj = []; obj.forEach(({ id, description: name, user: children }) => { newObj.push({ id, name, children: [children] }); }); console.log(JSON.stringify(newObj, null, 2)); .as-console-wrapper { max-height: 100% !important; }