【JS字符串】replace() – 用新的字符串替换字符串中的子字符串

在本教程中，您将了解如何使用 JavaScript String replace() 方法将字符串中的子字符串替换为新子字符串。

JavaScript String replace() 方法介绍

下面显示了 replace() 方法的语法：

let newStr = str.replace(substr, newSubstr);

JavaScript String replace() 方法返回一个新字符串，其中的子字符串 (substr) 被新字符串 (newSubstr) 替换。

请注意，replace() 方法不会更改原始字符串。 它返回一个新字符串。

JavaScript String replace() 示例

下面的例子使用 replace() 来替换字符串 ‘JS will, JS will rock you’ 中的 JS 和新的子字符串 JavaScript：

let str = ‘JS will, JS will rock you!’;
let newStr = str.replace(‘JS’,’JavaScript’);

console.log(newStr);

输出：

JavaScript will, JS will rock you!

从输出中可以看出，只有第一次出现的子字符串 JS 被替换为新的子字符串 JavaScript。

要用新子串替换字符串中所有出现的子串，您必须使用正则表达式。

使用正则表达式

replace() 方法完全支持正则表达式：

let newStr = str.replace(regexp, newSubstr);

在此语法中，replace() 方法查找 str 中的所有匹配项，用 newSubstr 替换它们，并返回一个新字符串 (newStr)。

以下示例使用全局标志 (g) 将 str 中出现的所有 JS 替换为 JavaScript：

let str = ‘JS will, JS will rock you!’;
let newStr = str.replace(/JS/g,’JavaScript’);

console.log(newStr);

输出：

JavaScript will, JavaScript will rock you!

如果要忽略搜索和替换的情况，可以在正则表达式中使用忽略标志 (i)，如下所示：

let str = ‘JS will, Js will rock you!’;
let newStr = str.replace(/JS/gi,’JavaScript’);

console.log(newStr);

输出：

JavaScript will, JavaScript will rock you!

使用替换函数

您可以传递替换函数，而不是将 newSubstr 传递给 replace() 方法的第二个参数，如下所示：

let newStr = str.replace(substr | regexp, replacer);

在此语法中，replace() 方法将在执行匹配后调用替换函数。 然后它使用此函数的结果作为替换字符串。

如果在正则表达式中使用全局标志 (g)，则 replace() 方法将为每个匹配项调用替换函数。

例如，如果有三个匹配项，replace() 方法将调用 replacer() 函数三次。

replacer() 函数具有以下语法：

function replacer(match, p1, p2, …, offset, string);

下面是各个参数的含义：

• match：是匹配的子串。
• p1, p2, …pn 是由正则表达式提供的带括号的捕获组找到的第 n 个字符串。
• offset：是匹配的子字符串在被搜索的整个字符串中的偏移量。
• String：是被检查的整个字符串。

以下示例使用 replace() 函数将子字符串 apples 和 bananas 更改为大写。 它将替换函数传递给 replace() 函数：

let str = “I like to eat, eat, eat apples and bananas”;
let re = /apples|bananas/gi;

let newStr = str.replace(re, (match) => {
console.log({match});
return match.toUpperCase();
});

console.log(newStr);

输出：

{match: “apples”}
{match: “bananas”}
I like to eat, eat, eat APPLES and BANANAS

总结

使用 replace() 方法返回一个新字符串，其中的子字符串被新字符串替换。

使用带有全局标志 (g) 的正则表达式将所有出现的子字符串替换为新子字符串。