基于指定字符串的数组排序异常：仅首词排序问题排查

开发网页时需要实现：用户输入字符串后，对数据数组排序，要求将以输入字符串开头的元素按完整字母顺序排列。但当前代码仅能正确排序元素首词，后续词顺序颠倒，需要排查问题并实现完整排序。

原代码 #

const data = [
  "DALIAN YI DA PRECISION RUBBER PRODUCTS CO., LTD.",
  "DALIAN TOSHIBA TELECISION CO.,LTD",
  "DALIAN SHENGFU BUSINESS FORM PRINTING CO.,LTD",
  "DALIAN SHENGFENG INTERNET OF THINGS TECHNOLOGY INC",
  "DALIAN OKEN SEIKO CO., LTD.",
  "DALIAN MATSUMOTOSHO TRADING CO.,LTD.",
  "DALIAN JINGSHIHENG ELECTRONIC TECH. CO., LTD.",
  "DHDC",
  "DALIAN HENGFENG ELECTRONIC TECH. CO., LTD.",
  "DALIAN GEETON ELECTRONICS CO.,LTD ",
  "DALIAN AUPAC CO.,LTD.",
  "DALIAN ALPS TEDA LOGISTICS CO.,LTD.",
  "CHIYODA INTEGRE (DALIAN) CO LTD",
  "HUICHANG LOGISTICS (BONDED LOGISTICZONE DALIAN CO",
  "MATSUYA R&D (DALIAN) CO., LTD.",
  "MIKURO SPRING (DALIAN) CO.,LTD",
];

const inputValue = "DALIAN";

data.sort((a, b) => {
  if (a.startsWith(inputValue.toUpperCase) && a>b) {
      return 1;
    } else if (a.startsWith(inputValue.toUpperCase)&& a<b){
        return -1
    }else{
        return 0
    }
});

console.log(data);

运行结果 #

[
'DALIAN YI DA PRECISION RUBBER PRODUCTS CO., LTD.',
'DALIAN TOSHIBA TELECISION CO.,LTD',
'DALIAN SHENGFU BUSINESS FORM PRINTING CO.,LTD',
'DALIAN SHENGFENG INTERNET OF THINGS TECHNOLOGY INC',
'DALIAN OKEN SEIKO CO., LTD.',
'DALIAN MATSUMOTOSHO TRADING CO.,LTD.',
'DALIAN JINGSHIHENG ELECTRONIC TECH. CO., LTD.',
'DHDC',
'DALIAN HENGFENG ELECTRONIC TECH. CO., LTD.',
'DALIAN GEETON ELECTRONICS CO.,LTD ',
'DALIAN AUPAC CO.,LTD.',
'DALIAN ALPS TEDA LOGISTICS CO.,LTD.',
'CHIYODA INTEGRE (DALIAN) CO LTD',
'HUICHANG LOGISTICS (BONDED LOGISTICZONE DALIAN CO',
'MATSUYA R&D (DALIAN) CO., LTD.',
'MIKURO SPRING (DALIAN) CO.,LTD'
]

问题点分析 #

1. toUpperCase调用错误：inputValue.toUpperCase未加括号，传递的是函数引用而非执行后的字符串，导致startsWith判断失效，部分符合条件的元素未被纳入排序逻辑，出现顺序颠倒。
2. 排序逻辑不完整：仅对单个符合条件的元素做局部比较，未处理两个元素都符合条件时的完整排序，也未处理不符合条件元素的相对位置（比如未将符合条件的元素优先前置）。

修正后的代码 #

const data = [
  "DALIAN YI DA PRECISION RUBBER PRODUCTS CO., LTD.",
  "DALIAN TOSHIBA TELECISION CO.,LTD",
  "DALIAN SHENGFU BUSINESS FORM PRINTING CO.,LTD",
  "DALIAN SHENGFENG INTERNET OF THINGS TECHNOLOGY INC",
  "DALIAN OKEN SEIKO CO., LTD.",
  "DALIAN MATSUMOTOSHO TRADING CO.,LTD.",
  "DALIAN JINGSHIHENG ELECTRONIC TECH. CO., LTD.",
  "DHDC",
  "DALIAN HENGFENG ELECTRONIC TECH. CO., LTD.",
  "DALIAN GEETON ELECTRONICS CO.,LTD ",
  "DALIAN AUPAC CO.,LTD.",
  "DALIAN ALPS TEDA LOGISTICS CO.,LTD.",
  "CHIYODA INTEGRE (DALIAN) CO LTD",
  "HUICHANG LOGISTICS (BONDED LOGISTICZONE DALIAN CO",
  "MATSUYA R&D (DALIAN) CO., LTD.",
  "MIKURO SPRING (DALIAN) CO.,LTD",
];

const inputValue = "DALIAN";
const upperInput = inputValue.toUpperCase();

data.sort((a, b) => {
  const aStartsWith = a.startsWith(upperInput);
  const bStartsWith = b.startsWith(upperInput);

  // 两个元素都符合前缀条件，按完整字母顺序排序
  if (aStartsWith && bStartsWith) {
    return a.localeCompare(b);
  }
  // 仅a符合，将a前置
  if (aStartsWith) {
    return -1;
  }
  // 仅b符合，将b前置
  if (bStartsWith) {
    return 1;
  }
  // 都不符合，按自身字母顺序排序（若需保留原顺序则返回0）
  return a.localeCompare(b);
});

console.log(data);

代码说明 #

• 提前计算upperInput，避免重复调用toUpperCase()，提升执行效率。
• 使用localeCompare替代直接字符串比较，适配多语言字符排序，结果更准确。
• 分层排序逻辑：
  • 优先处理两个元素都符合前缀的情况，执行完整字母序排序。
  • 将所有符合前缀条件的元素前置到数组头部。
  • 不符合条件的元素可按字母序排序，也可根据需求返回0保持原相对顺序。

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