如何使用Underscore.js实现JSON的升降序多维排序？

当然可以！Underscore.js虽然没有Lodash那样直接支持多字段带排序方向的_.orderBy API，但我们可以通过自定义比较器函数配合_.sort方法，轻松实现多维的升序、降序混合排序。我给你一步步拆解实现方式：

核心思路 #

我们需要编写一个通用的比较器函数，它接受一组排序规则（每个规则包含字段名和排序方向），然后在_.sort中使用这个比较器，依次对每个字段进行比较，直到找到能区分两个元素的字段为止。

代码实现示例 #

假设我们有如下JSON数据：

const products = [
  { category: 'Electronics', price: 999, stock: 5 },
  { category: 'Clothing', price: 49, stock: 20 },
  { category: 'Electronics', price: 699, stock: 10 },
  { category: 'Clothing', price: 29, stock: 15 },
  { category: 'Electronics', price: 999, stock: 2 }
];

我们的期望排序规则是：

1. 按category字段升序排列
2. 按price字段降序排列
3. 按stock字段升序排列

步骤1：编写通用多维比较器 #

function createMultiSortComparator(sortRules) {
  return function(a, b) {
    // 遍历每一条排序规则
    for (const [field, direction] of sortRules) {
      const valA = a[field];
      const valB = b[field];
      
      // 如果当前字段值不相等，就进行比较
      if (valA !== valB) {
        // 基础比较：升序时，a > b 返回1，否则返回-1
        let comparison = valA > valB ? 1 : -1;
        // 如果是降序，反转比较结果
        if (direction === 'desc') {
          comparison = -comparison;
        }
        return comparison;
      }
      // 如果当前字段值相等，继续比较下一个字段
    }
    // 所有字段都相等，返回0
    return 0;
  };
}

步骤2：使用Underscore的_.sort进行排序 #

// 定义排序规则：[字段名, 排序方向]
const sortRules = [
  ['category', 'asc'],
  ['price', 'desc'],
  ['stock', 'asc']
];

// 执行排序
const sortedProducts = _.sort(products, createMultiSortComparator(sortRules));

执行后得到的结果完全符合我们的期望：

[
  { category: 'Clothing', price: 49, stock: 20 },
  { category: 'Clothing', price: 29, stock: 15 },
  { category: 'Electronics', price: 999, stock: 2 },
  { category: 'Electronics', price: 999, stock: 5 },
  { category: 'Electronics', price: 699, stock: 10 }
]

备选简化方案（适合简单场景） #

如果你的排序规则只有最后一个字段是降序，也可以结合_.sortBy和_.reverse来实现，虽然灵活性稍差，但代码更简洁：

// 适合场景：先按category升序，再对同category的按price降序
const sortedProducts = _.chain(products)
  .sortBy('category')
  .groupBy('category')
  .map(group => _.sortBy(group, 'price').reverse())
  .flatten()
  .value();

但这种方法只适合层级较少的排序，当有多个升序降序混合的字段时，还是自定义比较器的方式更通用、更可控。

内容的提问来源于stack exchange，提问作者Kerberos