正则表达式(在代码中常简写为 RegEx 或 RegExp)是一种强大的分析文本的方法。使用正则表达式,你可以在匹配特定字符(例如 JavaScript)或模式(例如 NumberStringSymbol-3a&)的位置匹配字符串。

.replace 方法用于 JavaScript 中的字符串,以用字符替换字符串的一部分。这是它的使用示例:

const str = 'JavaScript';
const newStr = str.replace("ava", "-");
console.log(newStr);
// J-Script

如上所示,.replace 方法接受两个参数:要替换的字符串以及将替换为的字符串。

这就是正则的用武之地。

上面 .replace 的使用受到限制:要替换的字符是已知的——“ava”。如果我们想用某个模式,该怎么办? 也许是一个数字、两个字母和单词 “foo” 或三个符号一起使用?

.replace 方法可以实现此目的。可以用正则重新创建模式,将其与 .replace 结合使用,我们可以替换模式,而不仅仅是替换精确的字符。

如何在 JavaScript 中使用正则表达式和 .replace

要使用正则,需要将 replace 的第一个参数替换为正则语法(例如 /regex/)。此语法用作一种模式,其中与字符串匹配的任何部分都将被新的子字符串替换。

这是一个例子:

// matches a number, some characters and another number
const reg = /\d.*\d/
const str = "Java3foobar4Script"
const newStr = str.replace(reg, "-");
console.log(newStr);
// "Java-Script"

字符串 3foobar4 和正则 /\d.*\d/ 匹配,所以它被替换了。

如果我们想在多个地方进行替换呢?

正则表达式中的 g(全局)标记可以实现这个功能,并且也可以将其与 replace 一起使用,如下示例:

const reg = /\d{3}/g
const str = "Java323Scr995ip4894545t";
const newStr = str.replace(reg, "");
console.log(newStr);
// JavaScrip5t
// 5 didn't pass the test :(

正则表达式匹配字符串中正好是 3 个连续数字的部分。323995995995 都与模式匹配,但是最后的 5 与模式不匹配。

结果是 JavaScrip5t 显示了模式是如何正确匹配的,并用新的子字符串(空字符串)替换。

也可以使用大小写标记 i。这意味着你可以替换不区分大小写的模式。使用方法如下:

const reg1 = /\dA/
const reg2 = /\dA/i
const str = "Jav5ascript"
const newStr1 = str.replace(reg1, "--");
const newStr2 = str.replace(reg2, "--");
console.log(newStr1) // Jav5ascript
console.log(newStr2) // Jav--script

..5a .. 与第一个语法不匹配,因为正则表达式默认情况下区分大小写。但是,如第二个语法所示,使用了 i 标记后,该字符串将按预期被替换。

如何使用正则表达式和 split

也可以将 split  和正则表达式一起使用。这意味着你不仅可以将字符串拆分为与确切字符或模式匹配的子字符串,如下所示:

const regex = /\d{2}a/;
const str = "Hello54 How 64aare you";
console.log(str.split(regex))
// ["Hello54 How ", "are you"]

字符串在 64a 处被拆分,因为子字符串与正则表达式相匹配。

注意,与 i 标记和其他标记不同,全局标记 gsplit 中是无关紧要的。这是因为 split 在与正则表达式匹配的几个位置拆分了字符串。

小结

正则表达式使在 JavaScript 中替换字符串更加有效、更加强大,也更有趣。

不仅限于确切的字符,还可以同时使用模式和多个替换项。在本文中,我们通过一些示例了解了它们如何协同工作。

原文:JavaScript String.Replace() Example with RegEx,作者:Dillion Megida