如何用Lodash实现A..a、B..b…Z..z的自定义数组排序？

问题场景 #

我在项目中尝试用Lodash对数组排序，代码如下：

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 36 },
  { 'user': 'Fred',   'age': 40 },
  { 'user': 'Barney', 'age': 34 }
];

_.sortBy(users, 'user');

运行输出：

0: Object {user: "Barney", age: 34}
1: Object {user: "Fred", age: 40}
2: Object {user: "barney", age: 36}
3: Object {user: "fred", age: 48}

但我想要的排序是同字母下大写在前、小写在后（A..a、B..b……Z..z），期望输出：

0: Object {user: "Barney", age: 34}
1: Object {user: "barney", age: 36}
2: Object {user: "Fred", age: 40}
3: Object {user: "fred", age: 48}

请问怎么实现这种自定义排序？有没有其他可行方法？

可行方案 #

方案1：用Lodash的_.sortBy结合自定义迭代函数 #

_.sortBy默认按Unicode编码排序，大写字母编码比小写小，所以会先排所有大写再排小写。要实现同字母下大写在前，需要分两步排序：

_.sortBy(users, [
  o => o.user.toLowerCase(),
  o => o.user
]);

• 第一步按转小写后的用户名排序，把同字母的项归为一组
• 第二步按原用户名排序，利用Unicode特性让同组内大写排在小写前面

方案2：原生JSArray.sort实现 #

不想依赖Lodash的话，直接用原生数组的sort方法自定义比较逻辑：

users.sort((a, b) => {
  const lowerA = a.user.toLowerCase();
  const lowerB = b.user.toLowerCase();
  if (lowerA !== lowerB) {
    return lowerA.localeCompare(lowerB);
  }
  // 同字母时，原字符串比较确保大写在前
  return a.user.localeCompare(b.user);
});

先按小写字符串确定字母顺序，再对同字母的大小写做区分排序，同样能达到预期效果。

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