JavaScript sort()方法相等值场景次级排序不生效问题排查

你对sort()比较函数的返回值逻辑存在两个关键误解，才会导致相等项的排序完全不按预期生效：

• 比较函数不能对相等项固定返回1或-1：比较器必须满足对称性规则——如果比较a和b时返回值小于0代表a排b前面，那比较b和a时就必须返回大于0的值。如果你在两个项库存相等时固定返回1，当排序流程先拿Red和Orange比，返回1意味着Orange要排在Red前面；后续排序流程中拿Orange和Red比时，你还是返回1，这时候又要求Red排在Orange前面，逻辑自相矛盾，JS引擎遇到这种不符合规范的比较器，输出结果是完全不可预测的。
• 不要假设sort()的元素比较顺序：不同JS环境使用的排序算法不同，不会按你写的数组顺序从左到右两两比较一次就结束，排序过程中元素会被多次调换位置、重复比较，你固定返回非0值的写法会打乱整个排序逻辑。

次级排序不能靠固定返回1/-1实现，必须在库存相等的分支中，基于两个元素的实际属性值做对比，返回符合对称性规则的结果：

• 如果要实现你最开始说的「库存相等时销量高的排前面」，写法如下：

inventoryTally.sort(function (a, b) {
  // 主排序规则：库存降序
  if (a.inventoryTotal !== b.inventoryTotal) {
    return b.inventoryTotal - a.inventoryTotal;
  }
  // 次级排序规则：销量降序，把salesVolume替换成你实际存储销量的字段即可
  return b.salesVolume - a.salesVolume;
});

• 如果你只是想手动指定Red和Orange两个同库存项的相对顺序，也要基于属性判断返回对称值：

inventoryTally.sort(function (a, b) {
  if (a.inventoryTotal < b.inventoryTotal) return 1;
  if (a.inventoryTotal > b.inventoryTotal) return -1;

  // 库存相等时的自定义顺序：Orange排在Red前面
  if (a.option === 'Red' && b.option === 'Orange') return 1;
  if (a.option === 'Orange' && b.option === 'Red') return -1;
  // 其他同库存项保持原相对顺序
  return 0;
});

ES2019之后JS规范要求sort()必须是稳定排序，这个特性的生效前提是：比较函数对判定为相等的项返回0，此时这些相等项会保留和原数组一致的相对顺序。如果比较函数对相等项返回非0值，稳定排序规则也不会生效。

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