Map.groupBy()

items

一个可迭代对象（例如Array），其元素将被分组。

callbackFn

对可迭代对象中的每个元素执行的函数。它应该返回一个值（对象或原始值），指示当前元素所属的组。该函数使用以下参数调用

element

正在处理的当前元素。

index

正在处理的当前元素的索引。

一个Map对象，其中包含每个组的键，每个键都分配给一个包含关联组元素的数组。

Map.groupBy()对可迭代对象中的每个元素调用一次提供的callbackFn函数。回调函数应返回一个值，指示关联元素所属的组。callbackFn返回的值用作Map.groupBy()返回的Map的键。每个键都有一个关联的数组，其中包含回调返回相同值的的所有元素。

返回的Map中的元素和原始可迭代对象中的元素相同（不是深拷贝）。更改元素的内部结构将反映在原始可迭代对象和返回的Map中。

当您需要对与可能随时间变化的特定对象相关的信息进行分组时，此方法很有用。这是因为即使修改了对象，它仍将继续作为返回的Map的键。如果您改为为对象创建字符串表示形式并将其用作Object.groupBy()中的分组键，则必须在对象更改时维护原始对象与其表示形式之间的映射。

Map.groupBy不读取this的值。它可以在任何对象上调用，并且会返回一个新的Map实例。

首先，我们定义一个数组，其中包含表示不同食品库存的对象。每种食物都有一个type和一个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 },
];

下面的代码使用Map.groupBy()和一个箭头函数，该函数根据元素是否具有quantity < 6返回名为restock或sufficient的对象键。返回的result对象是一个Map，因此我们需要使用键调用get()来获取数组。

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 }]

请注意，函数参数{ quantity }是函数参数的对象解构语法的基本示例。这会解包作为参数传递的对象的quantity属性，并将其分配给函数体中名为quantity的变量。这是一种非常简洁的方式来访问函数内元素的相关值。

Map的键可以修改并继续使用。但是，您不能重新创建键并继续使用它。因此，任何需要使用映射的内容都必须保留其键的引用。

// The key can be modified and still used
restock["fast"] = true;
console.log(result.get(restock));
// [{ name: "bananas", type: "fruit", quantity: 5 }]

// A new key can't be used, even if it has the same structure!
const restock2 = { restock: true };
console.log(result.get(restock2)); // undefined

• core-js中Map.groupBy的 polyfill
• 索引集合指南
• Array.prototype.reduce()
• Map()
• Object.groupBy()