在前端开发中，我们常常需要对数据进行分组操作。而使用 lodash.groupby 这个 npm 包可以非常方便地实现这一操作。本文将介绍如何使用该包完成分组操作。
安装
在使用 lodash.groupby 之前，需要先安装它。使用 npm 安装：
npm install lodash.groupby
使用 yarn 安装：
yarn add lodash.groupby
使用方法
基本用法
假设有一个数组，每个元素都是一个对象，其中有一个字段叫做 category 表示分类：
const data = [
{ name: 'apple', category: 'fruit' },
{ name: 'banana', category: 'fruit' },
{ name: 'carrot', category: 'vegetable' },
{ name: 'potato', category: 'vegetable' },
{ name: 'orange', category: 'fruit' }
];我们想要将这个数组按照 category 字段进行分组，可以使用 lodash.groupby：
import groupBy from 'lodash.groupby'; const groupedData = groupBy(data, 'category'); console.log(groupedData);
输出结果为：
-- -------------------- ---- -------
-
------ -
- ----- -------- --------- ------- --
- ----- --------- --------- ------- --
- ----- --------- --------- ------- -
--
---------- -
- ----- --------- --------- ----------- --
- ----- --------- --------- ----------- -
-
-高级用法
lodash.groupby 还支持传入一个函数作为第二个参数，这个函数将被用来计算每个元素的分组键值：
-- -------------------- ---- -------
------ ------- ---- -----------------
----- ---- - -
- ----- -------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- -
--
----- ----------- - ------------- ------ -- -
-- ----------- - -- -
------ ------------
- ---- -
------ --------
-
---
-------------------------输出结果为：
-- -------------------- ---- -------
-
---------- -
- ----- -------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- -
--
------ -
- ----- --------- ------ --- --
- ----- --------- ------ --- -
-
-学习与指导意义
使用 lodash.groupby 可以方便地将数组按照某个字段或者某个计算规则进行分组。它可以让我们写出更加简洁、易读、易维护的代码。同时，它也是学习 lodash 这个常用工具库的一个很好的入门点。
示例代码
完整的示例代码如下：
-- -------------------- ---- -------
------ ------- ---- -----------------
----- ---- - -
- ----- -------- --------- ------- --
- ----- --------- --------- ------- --
- ----- --------- --------- ----------- --
- ----- --------- --------- ----------- --
- ----- --------- --------- ------- -
--
----- ----------- - ------------- ------------
-------------------------
----- ----- - -
- ----- -------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- --
- ----- --------- ------ --- -
--
----- ------------ - -------------- ------ -- -
-- ----------- - -- -
------ ------------
- ----
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------