Reduce con objetos: histogramas en JavaScript

Clase 12 de 24Curso de Manipulación Avanzada de Datos con JavaScript

Resumen

Domina el uso avanzado de reduce en JavaScript para resolver problemas reales: desde construir un histograma que cuenta votos por elemento hasta armar un reporte de ventas por categoría. Con un enfoque práctico, verás cómo el acumulador puede ser un objeto y cómo inicializar y actualizar índices de forma segura.

¿Qué es reduce y por qué usarlo para un histograma?

Un histograma cuenta cuántas veces aparece cada elemento en un array. Con reduce, transformas un array completo en un solo valor: en este caso, un objeto donde cada clave es el elemento y su valor es el conteo.

  • Entrada: un array de animalitos con votos.
  • Salida: un objeto con claves por animalito y su conteo.
  • Idea central: el acumulador inicia como objeto vacío y se actualiza por cada elemento.

¿Cómo funciona el acumulador con objetos?

El acumulador es el estado que viaja entre iteraciones. Aquí es un diccionario (objeto) que se va llenando:

  • Si la clave existe: se suma 1 al conteo.
  • Si no existe: se inicializa en 1 porque es el primer voto.
  • Siempre se retorna el acumulador en cada vuelta.

Este patrón evita crear nuevos índices innecesarios: solo crea al encontrar por primera vez y acumula después. Ejemplo descrito: perritos 3, gatitos 2, un loro y un conejo/hámster 1.

¿Qué papel tienen el valor inicial e Infinity?

El valor inicial define el estado antes de la primera iteración. Cuando se busca una suma máxima (como en el reto previo), se usa Infinity para manejar casos donde no hay con qué comparar la primera posición y para establecer un estado inicial válido. En el histograma, el valor inicial es un objeto vacío porque aún no hay conteos.

¿Cómo aplicar reduce para un reporte de ventas por categoría?

Se propone un reto con transacciones que incluyen ID, producto, categoría y precio. El objetivo es construir un reporte de ventas que agrupe el revenue por categoría y liste los productos vendidos en cada una.

  • Entrada: varias transacciones con categoría y precio.
  • Salida esperada: un objeto con categorías como claves.
  • Para cada categoría: suma total de revenue y productos vendidos.

¿Cuál es el algoritmo con reduce para agrupar y sumar?

  • Iniciar el acumulador como objeto vacío.
  • Para cada transacción: usar su categoría como clave.
  • Si la categoría ya existe: sumar el precio y agregar el producto.
  • Si no existe: crear la clave con revenue inicial y su lista de productos.
  • Retornar el acumulador en cada iteración.

Este enfoque replica el mismo patrón del histograma, pero en lugar de sumar 1, se suma el precio y se gestiona una lista de productos.

¿Qué incluye el output esperado?

  • Agrupaciones por categoría, como tech o food.
  • Revenue total por categoría.
  • Productos vendidos dentro de cada categoría.
  • Manejo de claves existentes y nuevas de forma segura.

¿Qué habilidades y conceptos prácticos se refuerzan?

Dominarás patrones que escalan a muchos problemas de datos en JavaScript.

  • Uso de reduce para transformar un array en un solo valor.
  • Construcción de un histograma con un diccionario como acumulador.
  • Verificación de existencia de índice/clave y actualización en caliente.
  • Manejo de valor inicial: objeto vacío o Infinity según el caso.
  • Lectura de index de iteración para depuración y trazas con console.log.
  • Agrupación por categoría y sumatoria de precios para revenue.
  • Pensamiento algorítmico con key-value y estado mutable controlado.

¿Te animas a compartir tu enfoque y resultado del reporte de ventas con reduce? Deja tus ideas y mejoras en los comentarios.