typeahead功能实现：过滤含搜索词记录后按startsWith优先排序

你现有实现的问题是 Array.sort() 的回调要求返回数字类型的排序标识（负数代表a排在前、0代表顺序不变、正数代表b排在前），你直接返回布尔值会被隐式转换为1/0，无法正确区分「开头匹配」和「仅包含匹配」的优先级。

正确实现方案 #

我们可以给每个匹配结果计算优先级，开头匹配的优先级更高（赋值更小的优先级数值），排序时按优先级升序排列即可，同优先级场景下还可以补充字符串自然排序规则提升使用体验：

const filterTerm = 'Azu'
const sourceData = [
  'Dotnet Developer',
  'Azure Administrator',
  'Microsoft Azure',
  'Azure DevOps',
  'UX Developer',
  'IOT Azure'
]

const matchedResult = sourceData
  // 第一步：过滤出所有包含搜索词的记录
  .filter(item => item.includes(filterTerm))
  // 第二步：按匹配优先级排序
  .sort((a, b) => {
    // 优先级定义：开头匹配为0，仅包含匹配为1，数值越小排序越靠前
    const priorityA = a.startsWith(filterTerm) ? 0 : 1
    const priorityB = b.startsWith(filterTerm) ? 0 : 1
    // 优先级不同时按优先级升序排
    if (priorityA !== priorityB) {
      return priorityA - priorityB
    }
    // 优先级相同时，按字符串自然字典序排序，可根据需求调整该逻辑
    return a.localeCompare(b)
  })

执行后输出结果和你预期完全一致：

• Azure Administrator
• Azure DevOps
• Microsoft Azure
• IOT Azure

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