如何在 JavaScript 中替换所有出现的字符串?

javascriptweb developmentfront end technology更新于 2024/6/20 19:48:00

本教程将教我们如何替换 JavaScript 中所有出现的字符串,这意味着在本教程结束时,我们将学习如何从给定的字符串中检测给定类型的子字符串,并将其替换为用户给定的另一个字符串。

要替换 JavaScript 中所有出现的字符串,我们有三种方法,我们将在本教程中看到,它们是:将字符串拆分为一个数组,然后通过在间隙中添加替换将其重新连接起来,使用全局正则表达式使用 replace() 方法,最后我们将看到 JavaScript 中字符串的 replaceAll() 方法。

拆分和合并数组

此方法背后的想法是从字符串中找到所需的子字符串,然后拆分其他部分并将它们存储在数组中,然后合并所有部分并在它们之间添加给定的替换并将其转换回字符串。

语法

让我们看看它的语法 -

const given_string;
const to_replace;
const replacement;
const string_after_splitting = given_string.split(to_replace);
const required_string = string_after_splitting.join(replacement);

在上面的语法中,我们声明了三个字符串,一个是我们想要执行替换的字符串,第二个是我们想要替换的字符串,最后一个是将要替换的字符串的替换字符串。

之后,我们使用 split() 方法拆分"given_string",并将其值存储在数组"string_after_splitting"中。最后,我们使用"join"方法连接数组的元素并给出一个"替换"字符串,并将其存储在"required_string"变量中(这是我们所需的最终答案/字符串)。

示例

让我们在一个示例中实现上述语法以更好地理解它 −

<!DOCTYPE html> <html> <body> <h3>Please press the button to replace and get the final string after replacement.</h3> <input type = "button" onclick = "replace()" value = "Press me"> </body> <script> function replace(){ const given_string = "In this string, every a is going to be a large a"; const to_replace = 'a'; const replacement = 'A'; const string_after_splitting = given_string.split(to_replace); const required_string = string_after_splitting.join(replacement); document.write("Previous string was: " + given_string+ "<br>"+"After replacement string is: " + required_string) } </script> </html>

使用 replace() 方法的全局正则表达式

此方法是字符串 replace() 函数的应用。在此方法中,我们将声明要替换的字符串为具有全局范围的正则表达式,并将搜索并用提供的字符串替换它以进行替换。

语法

让我们看看它的语法并了解它的工作原理 −

const given_string;
const to_replace = new RegExp(to_replace_string, 'g');
const replacement;
const required_string = given_string.replace(to_replace, replacement);

示例

让我们在一个示例中实现上述语法以更好地理解它 

<!DOCTYPE html> <html> <body> <h3>Please press the button to replace and get the final string after replacement.</h3> <input type = "button" onclick = "replace()" value = "Press me"> </body> <script> function replace(){ const given_string = "In this string, every a is going to be a large a"; const to_replace = new RegExp('a','g'); const replacement = 'A'; const required_string = given_string.replace(to_replace, replacement); document.write("Previous string was: " + given_string+ "<br>" + "After replacement string is: " + required_string) } </script> </html>

在 JavaScript 中使用字符串的 replaceAll() 方法

此方法类似于 replace() 方法,但唯一的区别是我们使用正则表达式,而这里我们使用一个简单的字符串进行替换。让我们直接转到语法并深入了解其工作原理。

语法

const given_string;
const to_replace;
const replacement;
const required_string = given_string.replaceAll(to_replace, replacement);

在上述语法中,我们声明了三个字符串,一个是我们要执行替换的字符串,第二个是我们要替换的字符串,最后一个是将要替换的字符串的替换字符串。

之后,我们使用 replaceAll() 方法用提供的字符串替换所有出现的给定字符串。

示例

让我们在一个示例中实现上述语法,以便更好地理解它 −

<!DOCTYPE html> <html> <body> <h3>Please press the button to replace and get the final string after replacement.</h3> <input type = "button" onclick = "replace()" value = "Press me"> </body> <script> function replace(){ const given_string = "In this string, every a is going to be a large a"; const to_replace = 'a'; const replacement = 'A'; const required_string = given_string.replaceAll(to_replace, replacement); document.write("Previous string was: " + given_string+ "<br>"+"After replacement string is: " + required_string); } </script> </html>

结论

在本教程中,我们学习了如何在 JavaScript 中替换所有出现的字符串。我们学习了如何从给定的字符串中检测给定类型的子字符串,并将其替换为用户提供的另一个给定字符串。

要在 JavaScript 中替换所有出现的字符串,有三种方法 - 将字符串拆分为数组,然后通过在间隙中添加替换将其重新连接,使用全局正则表达式使用 replace() 方法,最后使用 JavaScript 中字符串的 replaceAll() 方法。


相关文章