Estoy buscando crear una matriz anidada basada en la lectura de una matriz plana. Un ejemplo de la matriz plana que estoy leyendo es este:
const flatItems = [ { "code": "CODE1", "title": "Title 1", "question": "Question 1", "order": 0, }, { "code": "CODE2", "title": "Title 2", "question": "Question 2", "order": 1, }, { "code": "CODE3", "title": "Title 3", "question": "Question 3", "order": 2, }, { "code": "CODE4", "title": "Title 4", "question": "Question 4", "order": 3, }, ];E idealmente me gustaría colocar esto en grupos de 'Sí' y 'No'. La matriz plana ya está en el orden correcto. Solo habrá un elemento en los 'Sí', pero puede haber muchos en los 'No' dependiendo de las condiciones.
const treeItems = { question: "Question 1", options: [ { value: "Yes", items: [ { code: "CODE1", title: "Title 1" } ] }, { value: "No", question: "Question 2" options: [ { value: "Yes", items: [ { code: "CODE2", title: "Title 2" } ] }, { value: "No", items: [ { code: "CODE3", title: "Title 3" }, { code: "CODE4", title: "Title 4" } ] } ] } ] };Soy consciente de que reducir puede ser el mejor enfoque aquí, pero ¿alguien tendría buenos ejemplos o prácticas recomendadas sobre cómo debo hacer esto?
Si desea agrupar estos elementos, utilice "Sí" y "No" como propiedades del objeto final. Usar Array.reduce() suena sólido en este caso.
No estoy seguro de cómo desea agrupar porque su JSON es inconsistente.
const flatItems = [ { "code": "CODE1", "title": "Title 1", "question": "Question 1", "order": 0, }, { "code": "CODE2", "title": "Title 2", "question": "Question 2", "order": 1, }, { "code": "CODE3", "title": "Title 3", "question": "Question 3", "order": 2, }, { "code": "CODE4", "title": "Title 4", "question": "Question 4", "order": 3, }, ]; const groupedObject = flatItems.reduce((tmpGroupedObject, item) => { const groupingProperty = item.order < 2 ? "Yes" : "No"; /// grouping decision if (!Array.isArray(tmpGroupedObject[groupingProperty])) { tmpGroupedObject[groupingProperty] = []; /// make Obj["Yes"] an array } tmpGroupedObject[groupingProperty].push(item); return tmpGroupedObject; }, {}); console.log(groupedObject);Como se menciona en los comentarios, estoy confundido por el resultado solicitado. Especialmente, no entiendo por qué CODE3 y CODE4 están en el mismo nivel y no están anidados como otro par Sí/No. Pero podemos escribir una recursividad bastante simple para hacer eso:
const convert = ([{code, title, question} = {}, ...items]) => ({ question, options: [ {value: "Yes", items: [{code, title}]}, {value: "No", ... (items .length < 3 ? {items: items .map (({code, title}) => ({code, title}))} : convert (items))} ] }) const flatItems = [{code: "CODE1", title: "Title 1", question: "Question 1", order: 0}, {code: "CODE2", title: "Title 2", question: "Question 2", order: 1}, {code: "CODE3", title: "Title 3", question: "Question 3", order: 2}, {code: "CODE4", title: "Title 4", question: "Question 4", order: 3}] console .log ( convert (flatItems) ) .as-console-wrapper {max-height: 100% !important; top: 0} Sin embargo, al cambiar < 3 a < 2 , obtenemos lo que considero una agrupación mucho más lógica:
const convert = ([{code, title, question} = {}, ...items]) => ({ question, options: [ {value: "Yes", items: [{code, title}]}, {value: "No", ... (items .length < 2 ? {items: items .map (({code, title}) => ({code, title}))} : convert (items))} ] }) const flatItems = [{code: "CODE1", title: "Title 1", question: "Question 1", order: 0}, {code: "CODE2", title: "Title 2", question: "Question 2", order: 1}, {code: "CODE3", title: "Title 3", question: "Question 3", order: 2}, {code: "CODE4", title: "Title 4", question: "Question 4", order: 3}] console .log ( convert (flatItems) ) .as-console-wrapper {max-height: 100% !important; top: 0}Espero que uno de estos haga lo que quieres.
Además, de nuevo, bienvenido a StackOverflow. La próxima vez, asegúrese de publicar su propio intento de solución en la pregunta. Incluso si no funciona correctamente, a menudo podemos ayudarlo a solucionarlo o explicarle por qué se dirige por el camino equivocado.