¿Alguien sabe cómo agrupar objetos de matrices en una nueva matriz de matrices de objetos en función de su índice con Javascript? Soy bastante nuevo en esto, así que estoy bastante atrapado aquí.
Por ejemplo, tengo este objeto:
{ 'first': [ { name: 'jimmy', text: 'I love you' }, { name: 'jimmy', text: 'I miss you!' }, { name: 'jimmy', text: 'I hate you!' } ], 'second': [ { name: 'jeremy', text: 'Wow' } ], 'third': [ { name: 'john', text: 'You ugly' }, { name: 'john', text: 'You handsome' }, { name: 'john', text: 'you beautiful' } ], 'fourth': [ { name: 'tom', text: 'this is cool!' }, { name: 'tom', text: 'this is hard' } ] }que quiero transformar en algo como:
[ [ { name: 'jimmy', text: 'I love you' }, { name: 'jeremy', text: 'Wow' }, { name: 'john', text: 'You ugly' }, { name: 'tom', text: 'this is cool!' }, ], [ { name: 'jimmy', text: 'I miss you!' }, { name: 'john', text: 'You handsome' }, { name: 'tom', text: 'this is hard' } ], [ { name: 'jimmy', text: 'I hate you!' }, { name: 'john', text: 'you beautiful' } ] ]por lo tanto, 'primero' [1], 'segundo' [1], 'tercero' [1], 'cuarto' [1] debe agruparse en la primera matriz como matriz de objetos y 'primero' [2], 'segundo' [ 2], 'tercero'[2], 'cuarto'[2] debe ir a la segunda matriz como matriz de objetos y así sucesivamente.
Puedes usar reduce() para hacer esto.
const input = { first: [ { name: "jimmy", text: "I love you", }, { name: "jimmy", text: "I miss you!", }, { name: "jimmy", text: "I hate you!", }, ], second: [ { name: "jeremy", text: "Wow", }, ], third: [ { name: "john", text: "You ugly", }, { name: "john", text: "You handsome", }, { name: "john", text: "you beautiful", }, ], fourth: [ { name: "tom", text: "this is cool!", }, { name: "tom", text: "this is hard", }, ], }; const output = Object.values(input).reduce( (all, cur) => ( cur.forEach((item, idx) => idx < all.length ? all[idx].push(item) : (all[idx] = [item]) ), all ), [] ); console.log(output); .as-console-wrapper { max-height: 100% !important; top: 0; } En primer lugar, no nos importan las claves del objeto de input , por lo tanto, podemos usar Object.values() para obtener los valores.
Entonces, la idea es comenzar con una matriz vacía all (segundo argumento de reduce() ) y luego recorrer la input .
Luego, para cada elemento cur , recorremos todos los items de este elemento y para cada uno de estos items verificamos si ya tenemos el índice de este elemento ( idx ) en la matriz all .
Si no lo hacemos, este índice es más grande que cualquiera de los índices agregados anteriormente y necesitamos extender nuestra matriz all para mantener esos valores. Como esperamos múltiples valores para un lugar determinado, necesitamos usar una matriz como valor para ese lugar. Si ya tenemos al menos un valor para un índice dado, ya tenemos una matriz en el índice dado y solo necesitamos push() el nuevo elemento en all la matriz.
La respuesta de Mushroomator es probablemente la forma más concisa de hacer esto.
Si eres nuevo en JavaScript, programación funcional o programación en general, creo que el siguiente es un enfoque de nivel de introducción decente que podría ser más fácil de entender.
La lógica subyacente es la misma, los pasos se han hecho más explícitos/más evidentes.
output que contendrá el resultado.first , second , third y fourth de data mediante Object.values() .for .output aún no tiene una matriz anidada para el índice actual, cree una.Array#push() el elemento de la matriz actual en el índice actual en la matriz en el índice actual en la output . const data = { first:[{name:"jimmy",text:"I love you"},{name:"jimmy",text:"I miss you!"},{name:"jimmy",text:"I hate you!"}], second:[{name:"jeremy",text:"Wow"}], third:[{name:"john",text:"You ugly"},{name:"john",text:"You handsome"},{name:"john",text:"you beautiful"}], fourth:[{name:"tom",text:"this is cool!"},{name:"tom",text:"this is hard"}] }; const output = []; for (let arr of Object.values(data)) { for (let i = 0; i < arr.length; i++) { if (output[i] === undefined) { output[i] = []; } output[i].push(arr[i]); } } console.log(output); .as-console-wrapper { max-height: 100% !important; top: 0; }Aquí hay un enfoque en el que cambia de cada subarreglo al siguiente elemento para recopilar el siguiente subarreglo para el resultado:
let obj = {'first': [{name: 'jimmy',text: 'I love you'},{name: 'jimmy',text: 'I miss you!'},{name: 'jimmy',text: 'I hate you!'}],'second': [{name: 'jeremy',text: 'Wow'}],'third': [{name: 'john',text: 'You ugly'},{name: 'john',text: 'You handsome'},{name: 'john',text: 'you beautiful'}],'fourth': [{name: 'tom',text: 'this is cool!'},{name: 'tom',text: 'this is hard'}]}; let arr = Object.values(obj), result = []; while ((arr = arr.filter(sub => sub.length)).length) { result.push(arr.map(sub => sub.shift())); } console.log(result);