当前位置：首页 > JavaScript

js实现分类

2026-02-01 07:14:11JavaScript

JavaScript 实现分类的方法

在 JavaScript 中实现分类功能可以通过多种方式完成，具体取决于数据结构和使用场景。以下是几种常见的实现方法：

使用数组的 `filter` 方法

通过 filter 方法可以根据条件筛选出符合特定类别的元素。

js实现分类

const items = [
  { name: 'Apple', category: 'Fruit' },
  { name: 'Carrot', category: 'Vegetable' },
  { name: 'Banana', category: 'Fruit' }
];

const fruits = items.filter(item => item.category === 'Fruit');
console.log(fruits); // 输出 Fruit 类别的项

使用 `reduce` 方法分组

reduce 方法可以将数组元素按类别分组，生成一个以类别为键的对象。

const items = [
  { name: 'Apple', category: 'Fruit' },
  { name: 'Carrot', category: 'Vegetable' },
  { name: 'Banana', category: 'Fruit' }
];

const grouped = items.reduce((acc, item) => {
  if (!acc[item.category]) {
    acc[item.category] = [];
  }
  acc[item.category].push(item);
  return acc;
}, {});

console.log(grouped); // 输出按类别分组的对象

使用 `Map` 数据结构

Map 可以更高效地管理分类数据，尤其适用于动态添加或删除类别的情况。

js实现分类

const items = [
  { name: 'Apple', category: 'Fruit' },
  { name: 'Carrot', category: 'Vegetable' },
  { name: 'Banana', category: 'Fruit' }
];

const categoryMap = new Map();
items.forEach(item => {
  if (!categoryMap.has(item.category)) {
    categoryMap.set(item.category, []);
  }
  categoryMap.get(item.category).push(item);
});

console.log(categoryMap); // 输出分类后的 Map

使用 Lodash 的 `groupBy` 方法

如果项目中已引入 Lodash 库，可以直接使用 groupBy 方法快速分类。

const _ = require('lodash');
const items = [
  { name: 'Apple', category: 'Fruit' },
  { name: 'Carrot', category: 'Vegetable' },
  { name: 'Banana', category: 'Fruit' }
];

const grouped = _.groupBy(items, 'category');
console.log(grouped); // 输出按类别分组的对象

动态分类与多级分类

对于更复杂的场景（如多级分类），可以结合递归或嵌套数据结构实现。

const items = [
  { name: 'Apple', category: 'Fruit', subCategory: 'Tropical' },
  { name: 'Carrot', category: 'Vegetable', subCategory: 'Root' },
  { name: 'Banana', category: 'Fruit', subCategory: 'Tropical' }
];

const multiLevelGroup = (data, keys) => {
  return data.reduce((acc, item) => {
    const key = keys.map(k => item[k]).join('-');
    if (!acc[key]) acc[key] = [];
    acc[key].push(item);
    return acc;
  }, {});
};

const result = multiLevelGroup(items, ['category', 'subCategory']);
console.log(result); // 输出多级分类结果