JavaScript数组分组的多种方法及应用场景365


在JavaScript开发中,对数组进行分组是常见且重要的操作。它能有效地组织数据,方便后续的处理和展示。根据分组的依据和期望的结果,我们可以采用多种不同的方法实现数组分组。本文将深入探讨几种常用的JavaScript数组分组方法,并结合实际应用场景进行讲解,帮助你更好地理解和运用这些技巧。

一、根据属性值分组

这是最常见的分组方式,依据数组中对象的某个属性值进行分组。例如,一个包含用户信息的数组,我们可以根据用户的性别、年龄段或所在城市进行分组。 实现这种分组通常使用`reduce`方法,它能够遍历数组并累积结果。
const users = [
{ name: 'Alice', age: 25, city: '北京' },
{ name: 'Bob', age: 30, city: '上海' },
{ name: 'Charlie', age: 25, city: '北京' },
{ name: 'David', age: 35, city: '广州' },
{ name: 'Eve', age: 30, city: '上海' }
];
const groupedByCity = ((acc, user) => {
const city = ;
acc[city] = acc[city] || []; //如果城市不存在则创建一个空数组
acc[city].push(user);
return acc;
}, {});
(groupedByCity);
// 输出结果:
// {
// 北京: [ { name: 'Alice', age: 25, city: '北京' }, { name: 'Charlie', age: 25, city: '北京' } ],
// 上海: [ { name: 'Bob', age: 30, city: '上海' }, { name: 'Eve', age: 30, city: '上海' } ],
// 广州: [ { name: 'David', age: 35, city: '广州' } ]
// }

这段代码中,`reduce`方法将数组`users`按照`city`属性分组。初始值`{}`是一个空对象,每次迭代都将用户添加到对应的城市分组中。如果没有该城市的分组,则创建一个新的数组。

二、根据数值范围分组

有时候我们需要根据数值的范围进行分组,例如将学生按照成绩段分组(例如60-70分,70-80分等)。这种情况下,我们可以预先定义好分组的区间,然后根据数值判断其所属的区间。
const scores = [65, 78, 82, 95, 55, 72, 88, 68];
const scoreGroups = {
'60-70': [],
'70-80': [],
'80-90': [],
'90-100': []
};
(score => {
if (score >= 60 && score < 70) scoreGroups['60-70'].push(score);
else if (score >= 70 && score < 80) scoreGroups['70-80'].push(score);
else if (score >= 80 && score < 90) scoreGroups['80-90'].push(score);
else if (score >= 90 && score

2025-05-17


上一篇:JavaScript十六进制字符串详解:转换、操作与应用

下一篇:JavaScript 与 BLAS 库的结合:性能优化与实践