简介
cadr 是一个 npm 包，用于对数组进行计数，并返回一个按计数结果排序的对象，对于前端开发来说，经常需要对数组进行处理，例如计算出最常出现的元素，或者获取数组中出现次数超过某个值的元素等，cadr 包就提供了一种方便的解决方案。
安装
在命令行中输入以下指令，即可安装 cadr 包：
npm install cadr
使用
在需要使用 cadr 的文件中，首先需要引入 cadr 包：
const cadr = require("cadr");cadr(obj: Array<any>, [min: number, [sortKey: string]]): object
cadr 提供了一个函数，名为 cadr，用于计算并返回结果对象。
cadr 函数接受三个参数，分别为：
- obj：需要计数的数组，可以是任意类型的数组。
- min：指定元素最少出现的次数，默认值为 1。
- sortKey：指定排序的关键字，默认为空字符串，代表按元素的值排序。
示例代码：
const arr = [1, 2, 3, 1, 2, 2, 3, 3, 3, 4, 4, "a", "b", "a", "a", "b", "c"];
const result1 = cadr(arr);
console.log(result1);
// 输出：{ '1': 2, '2': 3, '3': 4, '4': 2, a: 3, b: 2, c: 1 }
const result2 = cadr(arr, 3);
console.log(result2);
// 输出：{ '3': 4 }深度学习
源码分析
cadr 源码十分简单，在这里进行源码分析。
-- -------------------- ---- -------
-------- --------- --- - -- ------- - --- -
----- --- - --- ------
-- ------ --- ------
--------------- -- -
----- ----- - ---------- -- --
-- ------------------------------ -
---------- ----- - ---
-- ---- -- -----
---
----- ------ - ---
-- ------
--------
-------------- ------- -- ----- -- ----
-- -------- --- ---
--------- -- -- -
----- ------ ------- - --
----- ------ ------- - --
-- -------- --- --- -
------ --------------- - ----------------
- ---- -
------ ------ - -------
-
--
-- -- ------- ----
--------------- ------- -- -
----------- - ------
-- ------
---
------ -------
-cadr 函数首先定义一个空的 Map 对象作为容器，然后遍历数组，对于每个元素，若容器中已存在该元素，则把该元素在容器中的数量 +1；若容器中不存在该元素，则将该元素的数量初始化为 0 后再 +1 并更新容器。这样遍历后，容器中存储了所有元素出现的次数。
接下来，cadr 函数定义一个空的对象作为结果对象，并将容器中的元素按数量筛选出符合条件的元素，然后按照指定字段进行排序，最后更新结果对象并返回。
高阶函数
cadr 函数中使用的是 forEach 遍历数组，结合上文的分析，这里不再讲解，而这里要介绍的是在这个函数中使用的另一个高阶函数，filter。
filter 函数是 Array 对象中的一个函数，作用是筛选数组中符合条件的元素，并将筛选后的元素返回。filter 函数接受一个函数参数，这个函数会被调用遍历数组中的每个元素，并返回一个布尔值，只有返回 true 的元素才会被过滤出来，最后以数组的形式返回。
示例代码：
const arr = [1, 2, 3, 4, 5]; const result = arr.filter((v) => v > 3); console.log(result); // 输出：[ 4, 5 ]
展开语法
在 cadr 函数中，用到了一个语法 ...map，这就是 ES6 中的展开语法，它可以展开一个可迭代对象（如数组、Map 等），并把里面的元素放置到一个新的数组中。在这里，[...map] 表示将 Map 对象中的每一对键值对按照 [key, value] 这种格式展开成一对数组，然后放置到一个新数组中。这样做的目的是为了使用 filter 和 forEach 函数，因为 Map 对象不是 Array。
示例代码：
-- -------------------- ---- ------- ----- --- - --- ----- ----- --- ----- --- ----- --- --- ----- ---- - --------- ------------------ -- ---- - ---- - -- - ---- - -- - ---- - - - ----- ---- - --- -- --- ----- ---- - ---------- ------------------ -- ---- -- -- - -
指导意义
cadr 包提供了一种方便的方法，用于对数组进行计数，返回一个排序后的结果对象。在前端开发中，经常需要对数组进行一些处理，例如：获取数组中出现次数最多的元素、去重、按照一定规则排序等。cadr 包中的 cadr 函数可以方便地完成这些操作，提高开发效率。
此外，cadr 包的源码十分简短，使用了 forEach、filter、展开语法等一些基础语法，对于初学者来说，可以作为学习 ES6 语法的一个小练习。
结语
本文介绍了 cadr 包的使用方法，并对其中用到的一些基础语法的特性进行了一些解析和讲解，同时，cadr 包的源码也进行了简单的分析。cadr 的使用非常简单，但在实际开发中可能也会遇到一些特殊需求，这时候就需要根据具体情况进行修改和扩展了。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055b7f81e8991b448d90c0