JavaScript生成子类别链接时连续短横的问题咨询

原问题的核心是：替换&为空后，原字符串中&前后的空格会变成连续空格，最终被替换成连续短横--。可以通过正则表达式一次性处理特殊字符和连续空格的问题，以下是两种可行的方案：

方案一：精准处理&及前后空格 #

直接将&和其前后任意数量的空格替换为单个空格，再统一将空格转短横：

const subcategoryLink = (sector) => {
  const sectorLink = `hire/${sector}`
  const lowerCaseLink = sectorLink.toLowerCase()
    .replace(/\s*&\s*/g, ' ') // 匹配&和前后任意空格，替换成单个空格
    .replaceAll(' ', '-');
  console.log(lowerCaseLink) // 输出：hire/indoor-outdoor-activities
  return lowerCaseLink
}

subcategoryLink("Indoor & Outdoor Activities");

方案二：通用特殊字符处理 #

如果需要兼容更多特殊字符（不止&），可以先把所有非字母、数字、斜杠的字符替换为空格，再将连续空格合并为单个短横：

const subcategoryLink = (sector) => {
  const sectorLink = `hire/${sector}`
  const lowerCaseLink = sectorLink.toLowerCase()
    .replace(/[^a-z0-9/]/g, ' ') // 替换所有非合法字符为空格
    .replace(/\s+/g, '-'); // 将连续空格替换为单个短横
  console.log(lowerCaseLink) // 输出：hire/indoor-outdoor-activities
  return lowerCaseLink
}

subcategoryLink("Indoor & Outdoor Activities");

这两种方案都能避免连续短横的问题，方案二更适合需要处理多种特殊字符的场景。

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