4

Tengo un array con objeto y necesito convertirlo en un arreglo con n posiciones segun los datos del los objetos

let data: [ {cant: 1, producto: "ZAPATOS"},
            {cant: 9, producto: "CAMISAS"},
            {cant: 30, producto: "ZAPATOS"}
          ]

Necesito convertirlo a

let datosFinales = [["ZAPATOS", 1, 30], ["CAMISAS", 9]]

No se si me estoy complicando:

let serieX = ["ZAPATOS", "CAMISAS"];

let final = data.reduce((ant, actual, a) => {
  if (actual.servicio === serieX[0]) {
    if (ant.length > 0) {
      console.log("entro", ant);
      ant.push(actual.cant);
      return [ant];
    } else {
      ant.push(actual.producto);
      ant.push(actual.cant);
      return [ant];
    }
  }
  if (actual.servicio === serieX[1]) {
    let arraySerie = ant.filter(previo => previo === serieX[1]);
    if (arraySerie.length > 0) {
      arraySerie.push(actual.cant);
      ant.push(arraySerie);
      return [ant];
    } else {
      arraySerie.push(actual.producto);
      arraySerie.push(actual.cant);
      ant.push(arraySerie);
      return ant;
    }
  }
}, []);
6
  • 1
    Y que llevas de codigo, en donde te estas deteniendo.? Commented el 10 jul. 2019 a las 15:21
  • igual ese formato de arreglo es muy complejo , te recomiendo algo como datosFinales = [{"ZAPATOS" : [1,30]}, {"CAMISAS" : [9]}?? Commented el 10 jul. 2019 a las 15:21
  • @Miguel Zarate le estoy pasando un arreglo con los posibles filtros
    – Gdaimon
    Commented el 10 jul. 2019 a las 15:34
  • @JackNavaRow no me sirve, estoy creando una grafica y me pide ese formato de arreglo :(
    – Gdaimon
    Commented el 10 jul. 2019 a las 15:35
  • ¿Seguro que quieres hacerlo con arr.reduce()? Quizá sea mas conveniente hacerlo con arr.map() Commented el 10 jul. 2019 a las 15:41

4 respuestas 4

4

Puedes usar Map, para guardar clave , valor, en el ejemplo la clave seria el producto y los valores seria el producto mas sus cantidades! y por ultimo convertilos en array con la funcion Array.from

let data= [ {cant: 1, producto: "ZAPATOS"},
            {cant: 9, producto: "CAMISAS"},
            {cant: 30, producto: "ZAPATOS"}
          ]

const grafico = new Map()
for (let i = 0; i< data.length; i++){
  let valor = grafico.get(data[i].producto)
  if(valor){
    valor.push(data[i].cant)
    
  }else{
    grafico.set(data[i].producto, [data[i].producto, data[i].cant])
    
  }
 

}
const resultado_final = Array.from(grafico.values())
console.log(resultado_final)

La linea valor.push(data[i].cant) tienen la misma referencia del objeto por ello no lo reasigne (array es de tipo objeto)

6
  • esta genial. ya lo logre solucionar de otra manera, pero veo que la tya es mas optima, porque como mencionaron que lo podia hacer mejor con un map lo hice iterando los datos dos veces :) mil gracias
    – Gdaimon
    Commented el 10 jul. 2019 a las 16:07
  • de hecho en esta solución pueden existir 2 iteraciones , pero el codigo es legible Commented el 10 jul. 2019 a las 16:11
  • Sólo una curiosidad. ¿Por qué usas un bucle for para iterar por un array en lugar de un Array.prototype.forEach()? Me ha encantado el uso de Map. +1 de mi parte Commented el 10 jul. 2019 a las 16:18
  • @FernandoCarrascosa trato de hacer ejemplos limpios que para que cualquier usuario sean faciles de comprender, por supuesto que se puede usar forEach! Commented el 10 jul. 2019 a las 16:19
  • @JackNavaRow lo unico que veo en detalle es que no declaraste la variable valor, por lo tanto quedaria declarada en el scope global, me equivoco?, yo le añadiria let valor = grafico.get(data[i].producto)
    – Gdaimon
    Commented el 10 jul. 2019 a las 16:27
4

La forma más inmediata que se me ocurre de obtener un array a partir de otro es usar Array.map().

De esta forma, teniendo el array

const data: [
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

Podrías generar un nuevo array con la forma que tu deseas aplicando cada uno de los objetos.

Te dejo una muestra de código:

const data = [
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

const myParsedData = data.map(obj => [obj.producto, obj.cant])

console.log(myParsedData)

Ahora bien, si, como veo en tu pregunta, si tienes productos repetidos con cantidades diferentes, quizá deberías combinar métodos.

Por ejemplo así:

const data = [ 
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

const myParsedData = [];

data.forEach(el => {
  const elementInParsedData = myParsedData.find(pos => pos[0] === el.producto);
  
  if(elementInParsedData === undefined){
    myParsedData.push([el.producto, el.cant]);
  } else {
    elementInParsedData.push(el.cant);
  }
});

console.log(myParsedData)

En este caso, lo que hago es lo siguiente:

  • Declaro un Array vacío
  • Itero usando el método forEach() realizando en cada paso lo siguiente
    • Se comprueba si ya existe un elemento con el valor de producto ya existe en el nuevo Array.
    • Si no existe, se añade al nuevo Array un elemento cuya posición 0 es el valor producto y cuya posición 1 es cant.
    • Si existe, al elemento en cuestión se le añade una nueva posición con la cant del elemento actual.

Y obtengo como resultado el array que dices esperar.

3
  • @Fernando Carrascosa algo parecido fue lo que logre, genial mil gracias por la ayuda y voy a tomar lo mejor de los dos cometarios, aprnedi varias cositas que estan usando, nuevamente mil gracias
    – Gdaimon
    Commented el 10 jul. 2019 a las 16:15
  • @JackNavaRow se me hace raro ver el operador ternario como algo complejo, pero lo cambio por if-else ;) Commented el 10 jul. 2019 a las 16:18
  • el operador ternario se escribe en una linea, por lo tanto el codigo no se ve limpio, el if else lo domina hasta el programador mas novato Commented el 10 jul. 2019 a las 16:21
3

Les dejo mi posible solución:

Primero cree un arreglo con los objetos:

const data = [ 
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

let dataX = [...new Set(data.map(dato => dato.producto))].map(
  dato => [dato]
);
console.log(dataX);

Después itere los datos inciales, para que filtre con los objetos anteriormente obtenidos:

const data = [ 
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

let dataX = [...new Set(data.map(dato => dato.producto))].map(
  dato => [dato]
);
for (let [indice, dato] of data.entries()) {
  for (let [index, datox] of dataX.entries()) {
    if (datox[0] === dato.producto) {
      datox.push(dato.cant);
      break;
    }
  }
}
console.log(dataX);

2
  • si bien el ejemplo funciona, creo que se ve demasiado complejo incluso hay por lo menos 4 iteraciones Commented el 10 jul. 2019 a las 16:25
  • 1
    @JackNavaRow si eso veo, por eso tomare lo mejor de los dos, mil gracias, pero por lo menos lo puede sacar :) y me sirvieron para dar una luz
    – Gdaimon
    Commented el 10 jul. 2019 a las 16:28
2

¡¡BOLA EXTRA!!

Como la pregunta inicial indicaba que quería hacerlo con reduce, he intentado hacer un pequeño ejemplo de cómo podría ser hacerlo con reduce, basándome en la respuesta que he publicado anteriormente.

Aquí la dejo.

Sigo basándome en lo mismo, en que el array que se genera no contenga ya un elemento cuyo valor 0 no sea igual al valor producto del elemento que se está evaluando.

const data = [
  {cant: 1, producto: "ZAPATOS"},
  {cant: 9, producto: "CAMISAS"},
  {cant: 30, producto: "ZAPATOS"}
];

const myParsedData = data.reduce((prev, curr) => {
  const previousProduct = prev.find(el => el[0] === curr.producto);
  if(!!previousProduct) {
    previousProduct.push(curr.cant);
    return prev
  } else {
    return [...prev, [curr.producto, curr.cant]];
  }
}, []);

console.log(myParsedData);

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.