JavaScript groupToMap 方法
最后修改于 2025 年 4 月 4 日
在本文中，我们展示了如何在 JavaScript 中使用 groupToMap 方法对数组元素进行分组。
使用 groupToMap 进行数组分组
groupToMap 方法根据回调函数对数组的元素进行分组。它返回一个 Map，其中键是分组值，值是元素数组。此方法对于根据特定标准将数据组织成类别非常有用。
与 group 不同，groupToMap 返回一个 Map 对象而不是一个普通对象。Map 保留插入顺序，并且可以使用任何值作为键，包括对象。分组操作后，原始数组保持不变。
回调函数接收每个元素并返回分组键。该方法在现代 JavaScript 环境中的 Array.prototype 上可用。它提供了一种有效的方法来对数据进行分类，同时保留原始元素引用。
基本的 groupToMap 示例
以下示例演示了 groupToMap 方法的基本用法。
const inventory = [
{ name: 'asparagus', type: 'vegetables' },
{ name: 'bananas', type: 'fruit' },
{ name: 'goat', type: 'meat' },
{ name: 'cherries', type: 'fruit' },
{ name: 'fish', type: 'meat' }
];
const grouped = inventory.groupToMap(item => item.type);
console.log(grouped);
我们创建一个对象数组，并根据它们的 type 属性进行分组。回调函数为每个元素返回 type 值。该方法返回一个 Map，其中键是唯一的 type 值，值是匹配对象的数组。
$ node main.js
Map(3) {
'vegetables' => [ { name: 'asparagus', type: 'vegetables' } ],
'fruit' => [
{ name: 'bananas', type: 'fruit' },
{ name: 'cherries', type: 'fruit' }
],
'meat' => [
{ name: 'goat', type: 'meat' },
{ name: 'fish', type: 'meat' }
]
}
按数值属性分组
groupToMap 方法可以根据数值对元素进行分组。
const students = [
{ name: 'Alice', score: 85 },
{ name: 'Bob', score: 72 },
{ name: 'Charlie', score: 85 },
{ name: 'David', score: 65 },
{ name: 'Eve', score: 72 }
];
const grouped = students.groupToMap(student => student.score);
console.log(grouped);
我们根据学生的考试分数对学生进行分组。回调函数返回数值分数。生成的 Map 使用分数作为键，并使用学生对象数组作为值。多个学生可以共享相同的分数。
$ node main.js
Map(3) {
85 => [
{ name: 'Alice', score: 85 },
{ name: 'Charlie', score: 85 }
],
72 => [
{ name: 'Bob', score: 72 },
{ name: 'Eve', score: 72 }
],
65 => [ { name: 'David', score: 65 } ]
}
使用复杂键进行分组
groupToMap 方法可以使用对象作为分组键。
const transactions = [
{ amount: 100, currency: 'USD', date: '2023-01-15' },
{ amount: 200, currency: 'EUR', date: '2023-01-15' },
{ amount: 150, currency: 'USD', date: '2023-01-16' },
{ amount: 300, currency: 'EUR', date: '2023-01-16' }
];
const grouped = transactions.groupToMap(tx => {
return { currency: tx.currency, date: tx.date };
});
console.log(grouped);
我们使用一个对象作为键，按货币和日期对交易进行分组。回调函数返回一个包含这些属性的对象。Map 使用这些对象作为键，演示了 groupToMap 处理复杂键类型的能力。
$ node main.js
Map(4) {
{ currency: 'USD', date: '2023-01-15' } => [
{ amount: 100, currency: 'USD', date: '2023-01-15' }
],
{ currency: 'EUR', date: '2023-01-15' } => [
{ amount: 200, currency: 'EUR', date: '2023-01-15' }
],
{ currency: 'USD', date: '2023-01-16' } => [
{ amount: 150, currency: 'USD', date: '2023-01-16' }
],
{ currency: 'EUR', date: '2023-01-16' } => [
{ amount: 300, currency: 'EUR', date: '2023-01-16' }
]
}
使用 thisArg 参数进行分组
groupToMap 方法接受一个可选的 thisArg 参数。
const products = [
{ name: 'Laptop', category: 'Electronics', price: 999 },
{ name: 'Shirt', category: 'Clothing', price: 25 },
{ name: 'Phone', category: 'Electronics', price: 699 },
{ name: 'Pants', category: 'Clothing', price: 40 }
];
const categoryGroups = {
Electronics: 'Tech',
Clothing: 'Apparel'
};
const grouped = products.groupToMap(function(product) {
return this[product.category] || 'Other';
}, categoryGroups);
console.log(grouped);
我们使用 thisArg 参数为回调函数提供上下文。回调函数使用提供的对象将类别名称映射到组名称。这演示了如何使用外部配置自定义分组逻辑。
$ node main.js
Map(2) {
'Tech' => [
{ name: 'Laptop', category: 'Electronics', price: 999 },
{ name: 'Phone', category: 'Electronics', price: 699 }
],
'Apparel' => [
{ name: 'Shirt', category: 'Clothing', price: 25 },
{ name: 'Pants', category: 'Clothing', price: 40 }
]
}
使用 index 参数进行分组
回调函数可以访问当前元素的索引。
const numbers = [10, 20, 30, 40, 50, 60, 70, 80, 90, 100];
const grouped = numbers.groupToMap((num, index) => {
return Math.floor(index / 3); // Group every 3 elements
});
console.log(grouped);
我们根据数组元素的索引对它们进行分组，每组创建三个元素。回调函数使用 index 参数计算组号。这演示了如何创建固定大小的元素批次。
$ node main.js
Map(4) {
0 => [ 10, 20, 30 ],
1 => [ 40, 50, 60 ],
2 => [ 70, 80, 90 ],
3 => [ 100 ]
}
来源
在本文中，我们演示了如何使用 groupToMap() 方法将数组元素组织成 JavaScript 中已分类的 Map 结构。
作者
列出 所有 JS 数组函数。