0

estoy trabajando con react, es un componente funcional q recibe como props una lista, es algo como esto:

[{count: 3, type: 'tipo1', values: ['valor1','valor2','valor3']},
{count: 4, type: 'tipo2', values: ['valor4','valor5','valor6','valor7,]},
{count: 2, type: 'tipo3', values: ['valor8','valor9']}]

Para hacer lo q quiero necesito q el objeto este de esta forma:

[{type: 'tipo1', value:'valor1'},
{type: 'tipo1', value: 'valor2'},
{type: 'tipo1', value: 'valor3'},
{type: 'tipo2', value: 'valor4'},
{type: 'tipo2', value: 'valor5'},
{type: 'tipo2', value: 'valor6'},
{type: 'tipo2', value: 'valor7'},
{type: 'tipo3', value: 'valor8'},
{type: 'tipo3', value: 'valor9'}]

El count no me importa mucho xq no lo uso como tal en esta parte, mi confusion esta en como pasar del objeto original al objeto nuevo q necesito ya sea usando reactHooks o solo js.

1 respuesta 1

0

Esto es muy fácil de hacer usando Array.ptototype.map, esto si quieres hacerlo en una sola línea, así el archivo es menos pesado pero también menos comprensible, pero si prefieres hacerlo paso a paso, puedes usar Array.ptototype.forEach.

Aquí te dejo las dos formas que yo veo para hacerlo

const array1 = [{count: 3, type: 'tipo1', values: ['valor1','valor2','valor3']},
{count: 4, type: 'tipo2', values: ['valor4','valor5','valor6','valor7',]},
{count: 2, type: 'tipo3', values: ['valor8','valor9']}];
const array2 = []; // Copia

array1.map(el => [el.values.forEach(value => array2.push({type:el.type, value})), el][1])
console.log(array2);

Básicamente lo que hacemos es recorrer el array, ya que el prototipo map cambia los elementos del array con lo que se le devuelva, vamos a crear un array de dos elementos, en el primero vamos a recorrer el array y vamos a poner nuevos elementos al otro array que será la copia con push, en el segundo el elemento por defecto, seguido a esto devolvemos el segundo elemento del array haciendo que el principal no se modifique.

La otra forma es prácticamente lo mismo, pero más larga.

const array1 = [{count: 3, type: 'tipo1', values: ['valor1','valor2','valor3']},
{count: 4, type: 'tipo2', values: ['valor4','valor5','valor6','valor7',]},
{count: 2, type: 'tipo3', values: ['valor8','valor9']}];
const array2 = []; // Copia

array1.forEach(el => {
  el.values.forEach(value => {
    const {type} = el;
    array2.push({type, value})
  });
});
console.log(array2)

Recorremos también el array, pero esta vez es una forma más legible, como podrás ver.

1
  • Muchas gracias! Tu respuesta me ayudo mucho! 😄 Commented el 21 dic. 2021 a las 16:08

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.