Question

下面是将html粗体标签添加到我们传递的子字符串的功能。

function boldString(str, find) {
    var re = new RegExp(find, 'g');
    return str.replace(re, '<b>' + find + '</b>');
}  

console.log(boldString("this is for testing purpose","testing"));
console.log(boldString("testing with (parentheses)","(parentheses)"));

为什么在第二种情况下输出不如预期？

Answer 1

括号是正则表达式中的保留符号。你会碰到同样的问题，例如.，+，*，[]等。

在构建正则表达式之前，您需要add escape characters to the text。（另外，使用.replace()函数接受形式并使用实际匹配字符串会更好。）

function escapeRegExp(str) {
  return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}

function boldString(str, find) {
    var re = new RegExp(escapeRegExp(find), 'g');
    return str.replace(re, function (m) {
      return '<b>' + m + '</b>';
    });
}

Answer 2

因为(和)（以及其他几个字符）在正则表达式中具有特殊含义，并且您没有对它们进行转义。你需要传入"\$parentheses\$"：第一个反斜杠转义字符串文字中的第二个，这样字符串实际上包含一个反斜杠;字符串中的反斜杠会转义(和)。

示例：

function boldString(str, find) {
    var re = new RegExp(find, 'g');
    return str.replace(re, '<b>' + find + '</b>');
}  

console.log(boldString("this is for testing purpose","testing"));
console.log(boldString("testing with (parentheses)","\\(parentheses\\)"));

当然，如果不更改boldString的输入，那么输出中也会包含反斜杠。正如melpomene在评论中指出的那样，您可以通过使用$&作为替换来解决这个问题，这将是与exppression匹配的文本：

function boldString(str, find) {
    var re = new RegExp(find, 'g');
    return str.replace(re, '<b>$&</b>');
}  

console.log(boldString("this is for testing purpose","testing"));
console.log(boldString("testing with (parentheses)","\\(parentheses\\)"));

如果您接受最终用户输入，this question's answers具有可用于添加任何必要转义的功能。例如，使用currently-accepted answer中的一个：

RegExp.escape= function(s) {
    return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
};

function boldString(str, find) {
    var re = new RegExp(RegExp.escape(find), 'g');
    return str.replace(re, '<b>' + find + '</b>');
}  

console.log(boldString("this is for testing purpose","testing"));
console.log(boldString("testing with (parentheses)","(parentheses)"));

为什么string.replace（）不适用于包含括号的字符串？

2 个答案: