如何在 JavaScript 中替換字串的所有出現？

本教程將教會我們如何在 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”方法連線陣列的元素，並給出了一個“replacement”字串，並將其儲存在“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()方法。

更新於： 2022年11月7日

11K+ 瀏覽量

開啟您的 職業生涯

透過完成課程獲得認證

開始學習
廣告