如何对含数字与字符串值的对象数组按name属性排序？

要实现你期望的按name属性的自然排序（字母前缀分组，后缀数字按数值大小排序），可以直接使用localeCompare并配置合适的参数，结合数组的sort方法完成。

实现代码 #

const arr = [
  {id:1, name: 'A1'},
  {id:2, name: 'A2'},
  {id:3, name: 'A3'},
  {id:4, name: 'B1'},
  {id:5, name: 'B2'},
  {id:6, name: 'A21'},
  {id:7, name: 'A11'},
  {id:8, name: 'A4'},
  {id:9, name: 'A12'},
];

// 排序逻辑
const sortedArr = [...arr].sort((a, b) => {
  return a.name.localeCompare(b.name, undefined, {
    numeric: true, // 让字符串中的数字按数值大小排序，而非字符串字典序
    sensitivity: 'base' // 忽略大小写差异（增强通用性，当前场景统一大写可省略）
  });
});

console.log(sortedArr.map(item => `${item.id}:${item.name}`).join(', '));
// 输出：1:A1, 2:A2, 3:A3, 8:A4, 7:A11, 9:A12, 6:A21, 4:B1, 5:B2

关键参数说明 #

• numeric: true：核心配置，它会识别字符串中的数字片段并按数值大小比较，解决了默认字符串排序中"A11"排在"A2"之前的问题，让数字部分遵循数值逻辑排序。
• sensitivity: 'base'：确保只有字符本身不同时才区分排序，避免大小写、重音等无关因素干扰排序结果。

补充说明 #

你给出的期望结果中未包含id:8的A4，按照标准自然排序逻辑，A4应排在A3之后、A11之前，上述代码会输出完整的符合自然排序规则的结果。如果需要排除特定元素，可在排序后额外执行过滤操作。

内容的提问来源于stack exchange，提问作者Nawapol R.