无法对数组按多个属性排序 如何实现先按姓氏后按名字排序

问题原因 #

• 排序函数的相等判断逻辑错误：你编写的orderByProp函数中，两个对比项的指定属性值相等时错误返回了-1，按照JSArray.sort()的规范，值相等时应返回0，这个错误会导致同属性值的元素排序完全混乱。
• 多字段排序的实现逻辑错误：你分开两次调用单属性排序，第二次按姓氏排序时会直接覆盖第一次按名字排序的效果，姓氏相同的条目根本不会保留名字排序的结果。
• 未注意sort是原地修改方法：JS的sort会直接修改原数组，你两次调用orderByProp实际操作的都是同一个数组，第二次排序会完全打乱第一次的排序结果。

正确实现代码 #

let input = "Mario:Rossi;Giuseppe:Bianchi;Roberta:Rossi;Alessia:Verdi;Federico:Bianchi;Cristina:Verdi;Andrea:Rossi";

// 拆分字符串为姓名对象数组
const nameArr = input.split(';').map(item => {
  const [firstName, lastName] = item.split(':');
  return { firstName, lastName };
});

// 多字段排序：先按姓氏排序，姓氏相同则按名字排序
nameArr.sort((a, b) => {
  // 优先对比姓氏
  const lastNameA = a.lastName.toLowerCase();
  const lastNameB = b.lastName.toLowerCase();
  if (lastNameA !== lastNameB) {
    return lastNameA.localeCompare(lastNameB);
  }
  // 姓氏相同时对比名字
  const firstNameA = a.firstName.toLowerCase();
  const firstNameB = b.firstName.toLowerCase();
  return firstNameA.localeCompare(firstNameB);
});

// 格式化为要求的全大写字符串数组
const result = nameArr.map(item => 
  `${item.lastName.toUpperCase()} ${item.firstName.toUpperCase()}`
);

console.log(result);
// 输出：["BIANCHI FEDERICO", "BIANCHI GIUSEPPE", "ROSSI ANDREA", "ROSSI MARIO", "ROSSI ROBERTA", "VERDI ALESSIA", "VERDI CRISTINA"]

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