负后向正则表达式的替代方法在 Firefox 中不起作用答案

【问题标题】：Alternative for negative lookbehind regex not working in Firefox负后向正则表达式的替代方法在 Firefox 中不起作用
【发布时间】：2023-03-13 16:27:01
【问题描述】：

这不是关于这个问题的第一个问题，但我找不到适合我的案例的解决方案。

我试图选择一个字符或一组字符，仅当它们前面没有字母数字字符时。示例：

这是一个例子（来自https://aniceone.com的简单句子）

我需要匹配“an”、“(a”和“https://aniceone.com”中的字母“a”。

以下表达式在 Chrome 中有效，但在 Firefox 中有效，所以我需要一个替代方法。

new RegExp(`((?<!\\w)${query})`, "gi")

请注意，要匹配的内容是动态到达的。在这里您可以看到整个功能（仅供参考，我正在尝试突出显示搜索查询中的文本）：

const getHighlightedText = (item, query) => {
  const escapedQuery = query.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
  const parts = item.split(new RegExp(`((?<!\\w)${escapedQuery})`, "gi"));
  return (
    <React.Fragment>
      {parts.map((part, ind) => (
        <span
          key={ind}
          style={
            part.toLowerCase() === query.toLowerCase()
              ? { fontWeight: "bold", backgroundColor: "#eeff00" }
              : {}
          }
        >
          {part}
        </span>
      ))}
    </React.Fragment>
  );
};

【问题讨论】：

您说query 是动态的，但您并没有转义它以用于正则表达式模式。这意味着如果此解决方案适合您，query 始终由单词字符组成，(?<!\w) 可以安全地替换为 \b 单词边界。
谢谢，Wiktor，部分工作。但是，你是对的，我没有转义正则表达式模式的特殊字符，这使得我的代码在某些情况下会中断，我已经编辑了代码来修复它。现在的问题是您的解决方案没有捕捉到特殊字符。

标签： javascript regex reactjs firefox

【解决方案1】：

您可能会找到 new RegExp(`(\\W|^)(${escapedQuery})`, "gi") 的所有匹配项，检查组 1 是否匹配，并通过仅在适当的索引处附加原始字符串的子字符串来填充最终的块数组。

看一个例子：

function splitSpecial(s, query) {
  var current=0, res=[], rx = new RegExp("(\\W|^)(" + query.replace(/[.*+?^${}()|[\]\\]/g, "\\$&") + ")", "gi");
  while (m=rx.exec(s)) {
    res.push(s.substring(current, m.index + (m[1] ? 1 : 0)));
    res.push(m[2]);
    current = m.index + m[0].length;
  }
  if (current < s.length) {
    res.push(s.substr(current));
  }
  return res;
}

console.log(splitSpecial("@abc abc@abc @abc,@abc!@abc", "@abc"));
// => ["", "@abc", " abc@abc ", "@abc", ",", "@abc", "!", "@abc" ]

【讨论】：