JS对象数组多条件排序：按required降序、sort升序如何实现

场景 #

现有如下结构的对象数组：

[
    { 
        required: false,
        sort: 1
    },
    { 
        required: true,
        sort: 2
    },
    { 
        required: false,
        sort: 3
    },
]

需要按照两级规则排序：

• 一级规则：优先按required字段降序（DESC）排列，required: true的项排在required: false的项之前
• 二级规则：required字段值相同的同组项，按sort字段升序（ASC）排列

期望得到的排序结果如下：

[
    { 
        required: true,
        sort: 2
    },
    { 
        required: false,
        sort: 1
    },  
    { 
        required: false,
        sort: 3
    },
]

原有代码问题 #

原有实现代码如下，仅能实现required: true项前置的效果，同组内sort字段排序未生效：

arr.sort((a, b) => {
    if (a.required) return -1

    return a.sort - b.sort
})

问题出在比较函数逻辑不完整：Array.sort的比较函数需要同时对比两个入参a、b的属性值返回对应结果，原逻辑仅判断了a.required的状态，未处理b.required的判断分支，且仅在a.required为false时才触发sort字段比较，逻辑覆盖不全导致同组排序失效。

正确实现 #

比较函数先判断两个元素的required值是否一致：不一致时优先保证required: true的项靠前；一致时再比较sort字段做升序排列即可。
完整代码：

arr.sort((a, b) => {
  // 第一优先级：required字段降序
  if (a.required !== b.required) {
    return a.required ? -1 : 1
  }
  // 第二优先级：sort字段升序
  return a.sort - b.sort
})

也可以使用更简洁的写法，利用布尔值转数字的特性+逻辑或短路实现：

arr.sort((a, b) => Number(b.required) - Number(a.required) || a.sort - b.sort)

上述代码执行后即可得到符合预期的排序结果。

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