前言
在编写前端应用时，对象排序是一个常见的需求。JavaScript 中提供了一些 array 的方法用以排序，但是这些方法只能对数组进行排序。针对对象的排序，我们可以通过自己编写排序算法实现。然而如果我们需要进行大量的排序操作，手写算法的工作量及其危险。这时未必不是一个好选择是寻找一个成熟的 npm 包来实现这个需求。
在众多的 npm 包中，can-sort-object （https://www.npmjs.com/package/can-sort-object）是一个出色的包。can-sort-object 提供了许多方法用以排序对象，支持多列排序，支持指定列的排序顺序和迭代顺序等等。此外，can-sort-object 基于 TypeScript 开发，因此对于 TypeScript 项目而言，使用它可以获得更好的类型检查和智能提示。
本篇文章将会详细介绍如何使用 can-sort-object 包进行对象排序。 欢迎你们阅读本篇文章，学习 can-sort-object 的使用。
安装
在使用 can-sort-object 之前，我们需要先安装它。可以使用如下命令：
npm install --save can-sort-object
可以将它作为项目依赖进行安装，也可以将它安装为全局模块，以供全局使用。
使用方法
can-sort-object 向导出了一个 sortObject 方法，这个方法可以用以排序对象。这个方法有三个参数：
- data: 需要排序的对象数组。
- criteria: 排序规则的数组。
- options: 可选的配置，用以指定排序选项。
首先我们看一下最简单的排序示例：
-- -------------------- ---- ------- ------ - ---------- - ---- ------------------ ----- ---- - - - --- -- ----- ------ -- - --- -- ----- ----- -- - --- -- ----- ------- - -- ----- -------- - -- ---- ----- ------ ----- --- ----- ---------- - ---------------- ---------- ------------------------ -- ------- - -- - --- -- ----- ------ -- -- - --- -- ----- ----- -- -- - --- -- ----- ------- - -- -
在上面的示例中，我们定义了一个对象数组 data，代表了需要排序的数据。这个对象包含两个 key：id 和 name。我们将使用 id 进行排序。我们将排序规则 criteria 定义为 [{ key: 'id', order: 'asc' }]，表示按照 id 进行升序排序。最后我们调用了 sortObject 方法，并且将结果存储在变量 sortedData 中。sortedData 就是排好序的结果。
上面的示例是一个极为简单的示例，更常见的情形是需要按照多列进行排序。can-sort-object 支持多列排序。需要排序列的数量与 criteria 数组中元素的个数相同。下面是一个按照两列进行排序的示例：
-- -------------------- ---- ------- ------ - ---------- - ---- ------------------ ----- ---- - - - --- -- ----- ------- ---- -- -- - --- -- ----- ------ ---- -- -- - --- -- ----- -------- ---- -- -- - --- -- ----- ------- ---- -- -- - --- -- ----- ------- ---- -- -- - --- -- ----- ------ ---- -- -- - --- -- ----- -------- ---- -- -- - --- -- ----- ------ ---- -- -- - --- -- ----- -------- ---- -- - -- ----- -------- - - - ---- ------- ------ ----- -- - ---- ------ ------ ----- - -- ----- ---------- - ---------------- ---------- ------------------------ -- ------- - -- - --- -- ----- ------- ---- -- -- -- - --- -- ----- ------- ---- -- -- -- - --- -- ----- ------- ---- -- -- -- - --- -- ----- ------ ---- -- -- -- - --- -- ----- ------ ---- -- -- -- - --- -- ----- ------ ---- -- -- -- - --- -- ----- -------- ---- -- -- -- - --- -- ----- -------- ---- -- -- -- - --- -- ----- -------- ---- -- - -- -
在上面的示例中，我们的数据包含了三个 key：id、name 和 age。我们需要按照 name 和 age 进行排序。我们将排序规则定义为 [{ key: 'name', order: 'asc' }, { key: 'age', order: 'asc' }]。这表示按照 name 进行升序排序，如果在 name 相同的情况下，则按照 age 进行升序排序。
can-sort-object 支持多种排序顺序和迭代顺序，以及指定排序后的迭代顺序。这个参数可以在第三个参数 options 中指定。下面是一个使用迭代顺序的例子：
-- -------------------- ---- ------- ------ - ---------- - ---- ------------------ ----- ---- - - - --- -- ----- ------ -- - --- -- ----- ------- -- - --- -- ----- ----- - -- ----- -------- - -- ---- ----- ------ ------ --- ----- ------- - - -------- ------- -- ----- ---------- - ---------------- --------- --------- ------------------------ -- ------- - -- - --- -- ----- ----- -- -- - --- -- ----- ------- -- -- - --- -- ----- ------ - -- -
在上面的示例中，我们将迭代顺序指定为 'after'，表示当我们按照 id 进行降序排序后，我们希望排序后的数据能够从数据尾到头进行迭代。由于 sortObject 返回的结果始终是一个数组，因此我们需要在 options 中指定迭代顺序。
总结
can-sort-object 是一个基于 TypeScript 开发的排序对象的 npm 包，能够应对多列排序，排序顺序，迭代顺序等需求。使用它可以方便地对对象数组进行排序操作。在这篇文章中，我们介绍了 can-sort-object 的安装和使用方法，并且提供了多个示例供大家学习参考。希望对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/75756