使用动态 RegExp 获得 1 美元的捕获组

Question

我很好奇是否有人知道我在这里做错了什么。我想在表达式中使用一个变量，但由于某种原因，当我尝试使用时，它似乎没有使用$1 抓取搜索词。

这会正确返回：

$('.content').html(function(_,i) {
  return  i.replace(/(cat)/gi, '<span class="highlight">$1</span>');
});

由于某种原因，这不是：

$('.content').html(function(_,i) {
  var customVariable = 'cat';
  var pattern = new RegExp(customVariable,'gi');
  return  i.replace(pattern, '<span class="highlight">$1</span>');
});

我是在 RegExp 中捕获组的新手，我找不到其他人遇到这个问题，所以我想我错过了一些非常简单的东西。

Answer 1

你忘了括号：

var pattern = new RegExp('(' + customVariable + ')','gi');

$1 是对第 1 组的反向引用，而您没有。

实际上，您可以在 MDN 网站上的 JavaScript replace 中找到 more about backreferences。确实，如果您不想在替代项之前或之后匹配任何文本，则不需要设置捕获组，因为使用正则表达式时，可以使用 $& 模式引用整个匹配的文本（在您的情况下，您只需将$1 替换为$&）。

$&     插入匹配的子字符串。

Answer 2

您不需要定义子模式，因为您要突出显示整个匹配。你可以这样做：

var pattern = new RegExp(customVariable, 'gi');
i.replace(pattern, '<span class="highlight">$&</span>');

$& 指的是整个模式。