数组排序需求：将isActive为false的元素置于排序结果末尾

我有一个包含用户对象的数组，现有排序函数可按firstName升序排列元素，但需要将所有isActive: false的元素放到排序后的数组末尾，同时同状态下的元素仍保持firstName升序规则。

原数组 #

var arr = [{
    firstName: 'Jane',
    lastName:'Doe',
    age:19,
    isActive: true
},
{
    firstName: 'Wane',
    lastName:'Doe',
    age:21,
    isActive: false
},
{
    firstName: 'Kane',
    lastName:'Doe',
    age:23,
    isActive: false
},
{
    firstName: 'Mane',
    lastName:'Doe',
    age:25,
    isActive: true
}]

现有排序函数 #

const sortedRows = (rows: any) => {
            let order === 'asc'; // 这里存在语法错误，应为赋值运算符=
            return [...rows].sort((a, b) => {
                const aData = a['firstName'] === null ? '' : a['firstName'];
                const bData = b['firstName'] === null ? '' : b['firstName'];

                if (order === 'asc') {
                    return aData > bData ? 1 : -1;
                }
                return bData > aData ? 1 : -1;
            });
};

期望结果 #

[
  {
    "firstName": "Jane",
    "lastName": "Doe",
    "age": 19,
    "isActive": true
  },
  {
    "firstName": "Mane",
    "lastName": "Doe",
    "age": 25,
    "isActive": true
  },
  // 所有isActive: false的元素排在末尾
  {
    "firstName": "Kane",
    "lastName": "Doe",
    "age": 23,
    "isActive": false
  },
  {
    "firstName": "Wane",
    "lastName": "Doe",
    "age": 21,
    "isActive": false
  }
]

解决方案 #

要实现需求，需在排序逻辑中优先判断isActive状态，再按firstName排序。具体逻辑：

• 若两个元素isActive状态不同，true的元素直接排在前面
• 状态相同时，按firstName升序排序

修正后的排序函数如下：

const sortedRows = (rows: any) => {
  const order = 'asc'; // 修正语法错误，将===改为=
  return [...rows].sort((a, b) => {
    // 优先比较活跃状态：true在前，false在后
    if (a.isActive !== b.isActive) {
      return a.isActive ? -1 : 1;
    }
    // 状态相同时，按firstName升序排序
    const aData = a.firstName === null ? '' : a.firstName;
    const bData = b.firstName === null ? '' : b.firstName;
    if (order === 'asc') {
      return aData.localeCompare(bData); // 用localeCompare更严谨，适配多场景字符串排序
    }
    return bData.localeCompare(aData);
  });
};

关键说明 #

1. 修正了原代码中let order === 'asc'的语法错误，赋值需用=而非全等运算符===
2. 新增isActive优先级判断，确保活跃用户始终排在非活跃用户之前
3. 替换字符串比较方式为localeCompare，相比直接用>/<，能更准确处理特殊字符、多语言等场景的排序
4. 保留原有的空值处理逻辑：firstName为null时视为空字符串参与排序

调用该函数后，即可得到符合预期的排序结果。

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