ES12 标准下的 JavaScript 字符串方法：replace()

在 JavaScript 中，字符串是一种常见的数据类型。在处理字符串时，我们经常需要用到字符串方法。ES12 标准中新增了一些字符串方法，其中 replace() 方法是其中之一。

replace() 方法的基本用法

replace() 方法用于替换字符串中的某个部分。它接受两个参数，第一个参数是要替换的字符串或正则表达式，第二个参数是要替换成的字符串或函数。

使用字符串替换：

const str = 'Hello, world!';
const newStr = str.replace('world', 'JavaScript');
console.log(newStr); // Hello, JavaScript!

使用正则表达式替换：

const str = 'Hello, world!';
const newStr = str.replace(/world/, 'JavaScript');
console.log(newStr); // Hello, JavaScript!

使用函数替换：

const str = 'Hello, world!';
const newStr = str.replace(/world/, match => match.toUpperCase());
console.log(newStr); // Hello, WORLD!

在函数中，第一个参数 match 是匹配到的字符串，我们可以在函数中对它进行处理，然后返回一个新的字符串。

replace() 方法的高级用法

replace() 方法还有一些高级用法，让我们来看看它们。

使用正则表达式替换所有匹配项

默认情况下，replace() 方法只会替换第一个匹配项。如果想要替换所有匹配项，可以使用正则表达式中的全局标志 g。

const str = 'Hello, world! Hello, JavaScript!';
const newStr = str.replace(/Hello/g, 'Hi');
console.log(newStr); // Hi, world! Hi, JavaScript!

使用正则表达式替换匹配项并保留原有内容

有时候我们需要替换匹配项，并且还要保留原有内容，可以使用正则表达式中的捕获组和反向引用。

const str = 'Hello, JavaScript!';
const newStr = str.replace(/(Java)(Script)/, '$1 $2 is awesome');
console.log(newStr); // Hello, Java Script is awesome!

在这个例子中，我们使用了一个带有两个捕获组的正则表达式，用 $1 和 $2 来引用这两个捕获组，然后在替换字符串中使用它们。

使用函数替换匹配项并保留原有内容

和上面的例子类似，我们也可以使用函数来替换匹配项并保留原有内容。

const str = 'Hello, JavaScript!';
const newStr = str.replace(/(Java)(Script)/, (match, p1, p2) => `${p1} ${p2} is awesome`);
console.log(newStr); // Hello, Java Script is awesome!

在函数中，第一个参数 match 是匹配到的字符串，后面的参数是捕获组的值。

总结

replace() 方法是一个非常实用的字符串方法，可以方便地替换字符串中的某个部分。除了基本用法外，它还有一些高级用法，可以让我们更加灵活地处理字符串。在日常的开发中，我们经常需要用到这个方法，因此掌握它的使用方法是非常有意义的。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65ffe418d10417a222b22fef