Map.groupBy()

Prubalo

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 9 },
  { name: "bananas", type: "fruit", quantity: 5 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 12 },
  { name: "fish", type: "meat", quantity: 22 },
];

const restock = { restock: true };
const sufficient = { restock: false };
const result = Map.groupBy(inventory, ({ quantity }) =>
  quantity < 6 ? restock : sufficient,
);
console.log(result.get(restock));
// [{ name: "bananas", type: "fruit", quantity: 5 }]

Sintaxis

Map.groupBy(items, callbackFn)

Parmetros

items

Un iterable (as como un Array) cuyos elementos sern agrupados.

callbackFn

Una funcin que se ejecuta por cada elemento en el iterable. Debe regresar un valor (object o un primitive) indicando el grupo del elemento actual. La funcin es llamada con los siguientes argumentos:

element

El elemento actual que est siendo procesado.

index

El ndice del elemento actual que esta siendo procesado.

Valor regresado

Un objeto Map con llaves para cada grupo, cada llave asignada a un arreglo que contiene los elementos del grupo asociado.

Descripcin

Map.groupBy() llama a la funcin de devolucin de llamada callbackFn pasada como parmetro, una vez por cada elemento en el iterable. La funcin de devolucin de llamada debe regresar un valor indicando el grupo del elemento asociado. Los valores regresados por la callbackFn son utilizados como llaves para el Map regresado por Map.groupBy(). Cada llave tiene asociado un arreglo que contiene todos los elementos para los cuales la funcin de devolucin de llamada regres el mismo valor.

Los elementos en el objeto Map regresado por la funcin y en el iterable original, son los mismos (sin copias profundas). Al cambiar la estructura interna de los elementos, esta se vera reflejada en ambos, el iterable original y el Map regresado por la funcin.

Este mtodo es util cuando necesitas agrupar informacin que est relacionada a un objeto en particular y que potencialmente puede cambiar con el tiempo. Esto es debido a que, incluseo si el objeto es modificado, continuar funcionando como llave para el objeto Map regresado por la funcin. Si en su lugar creas una representacin string para el objeto y la utilizas como la llave para agrupar en Object.groupBy(), debes mantener el mapeo entre el objeto original y su representacion de acuerdo a como el objeto cambia.

Map.groupBy no lee el valor de this. Puede ser llamado en cualquier objeto y regresar una nueva instancia de Map.

Ejemplos

Utilizando Map.groupBy()

Primero definimos un arreglo que contenga objetos que representen un inventario de diferentes alimentos. Cada alimento tiene un type y un quantity.

const inventory = [
  { name: "asparagus", type: "vegetables", quantity: 9 },
  { name: "bananas", type: "fruit", quantity: 5 },
  { name: "goat", type: "meat", quantity: 23 },
  { name: "cherries", type: "fruit", quantity: 12 },
  { name: "fish", type: "meat", quantity: 22 },
];

El cdigo de abajo utiliza Map.groupBy() con una funcin flecha que regresa las llaves de objeto llamadas restock o sufficient, dependiendo de si la propiedad del elemento es quantity < 6. El objeto result que regresa, es un Map as que necesitamos llamar get() con la llave para obtener el arreglo.

const restock = { restock: true };
const sufficient = { restock: false };
const result = Map.groupBy(inventory, ({ quantity }) =>
  quantity < 6 ? restock : sufficient,
);
console.log(result.get(restock));
// [{ name: "bananas", type: "fruit", quantity: 5 }]

Note que el argumento { quantity } de la funcin, es un ejemplo bsico de la sintaxis de destructuracin de objetos pasados como parmetros de funcin. Esto desempaca la propiedad quantity del objeto pasado como parmetro, y lo asigna a la variable llamada quantity en el cuerpo de la funcin. Esta es una forma muy concisa de accesar los valores relevantes de elementos, dentro de una funcin.

La llave de un Map puede ser modificada y an usarse. Sin embargo no puedes recrear la llave y an usarla. Por esa razn es importante que cualquiera que necesite usar el map mantenga una referencia de sus llaves.

// La llave puede ser modificada y an usarse
restock["fast"] = true;
console.log(result.get(restock));
// [{ name: "bananas", type: "fruit", quantity: 5 }]

// Una nueva llave no puede ser usada, incluso si tiene la misma estructura!
const restock2 = { restock: true };
console.log(result.get(restock2)); // undefined

Especificaciones

Compatibilidad con navegadores

Vase tambin

• Polyfill de Map.groupBy en core-js
• Gua de Colleciones indexadas
• Array.prototype.reduce()
• Map()
• Object.groupBy()