javascript 正则表达式替换，如何提供正则表达式条件(和标志)作为变量而不是内联？

Question

用JS的regex替换函数，会有几十条replace语句。

var NewHTML = OriginalHTML
.replace(/\bJavaScript\b/gi, "<a href=\"http://js.com/\">$&</a>")
.replace(/\bMySQL\b/gi, "<a href=\"http://www.mysql.com/\">$&</a>")
;

为了使其更易读和更易于管理(即更容易通过在一个地方而不是每一行更改它来更改正则表达式模式或标志)，尝试将替换正则表达式条件和替换标志移出到一个单独的变量中:

var pattern = /\b(?!\-)(?!\/)\b(?!\-)/gi;

var NewHTML = OriginalHTML
.replace("JavaScript", "<a href=\"http://js.com/\">$&</a>", pattern)
.replace("MySQL", "<a href=\"http://www.mysql.com/\">$&</a>", pattern)    

问题是，内联调用被完全忽略了......正则表达式部分和标志部分。

谁能发现 JS 替换调用或 regex/flags 变量的声明有什么问题？ :-)

谢谢!

Answer 1

我会使用查找对象将原件映射到 URL:

// Original string
var o = "MySql is a DBMS, whereas javascript is a client side scripting language";

//Patterns
var patterns = {
    "javascript": "http://js.com/",
    "mysql": "http://www.mysql.com/"
};

//Constructing regex
RegExp.escape= function(s) {
    return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')
};
var keys = [];
for (i in patterns) {
    if (patterns.hasOwnProperty(i)) {
        keys.push(RegExp.escape(i));
    }
}
var pattern = new RegExp("\\b(" + keys.join("|") + ")\\b", "gi");

//Replace
var n = o.replace(pattern, function(m, g1) {
    return "<a href='" + patterns[g1.toLowerCase()] + "'>" + g1 + "< /a>";
});
console.log(n);

这是一个演示:http://jsfiddle.net/qP9Er/

---

编辑:

根据您的要求，这是一个替换前 n 次出现的版本。可以找演示here :

// Original string
var o = '<p>Test 1 (JavaScript - <strong>1st keyword instance to be replaced</strong>): <br><a href="http://js1.net">Link to JavaScript site (existing URL)</a> is a scripting language commonly implemented as part of a web browser in order to create enhanced user interfaces and dynamic websites. JavaScript is very flexible.</p><p>more text here... and another mention of JavaScript. also javascript and JAVAScrIPT <br><br></p><p>Test 2 (MySQL - <strong>1st keyword instance to be replaced</strong>): <br><a href="http://www.mysql.com">MySQL</a>  (existing URL) is the most popular open-source database system.</p> <p><a href="http://www.themysqllink.com">link to a MySQL site</a> (existing URL).</p><p> More stuff about Mysql, also mysql and mySQL</p>';

//Patterns
var patterns = {
    "javascript": "http://js.com/",
    "mysql": "http://www.mysql.com/",
    "mention": "http://www.x.com/"
};

//Number of replacements
var num = 1;

//Constructing regex
RegExp.escape = function(s) {
    return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
};
var keys = [];
for (key in patterns) {
    if (patterns.hasOwnProperty(key)) {
        keys.push(RegExp.escape(key));
    }
}
var regexen = [];
for (var i = 0; i < keys.length; i++) {
    regexen[i] = new RegExp("\\b(" + keys[i] + ")\\b(?![^<]*?<\/a>)", "i");
}

//Replace
for (var i = 0; i < regexen.length; i++) {
    var count = 0;
    var pattern = regexen[i];
    while (count < num) {
        o = o.replace(pattern, function(m, g1) {
            return "<a href='" + patterns[g1.toLowerCase()] + "'>" + g1 + "</a>";
        });
        count++;
    }
}
document.write(o);