在JavaScript代碼中出現(xiàn)這個字符串：

"Test abc test test abc test test test abc test test abc"

比如直接使用replace替換的方法，如下：

str = str.replace('abc', '');

似乎只刪除了abc上面字符串中第一次出現(xiàn)的。我怎樣才能替換它的所有出現(xiàn)？下面介紹4種替換所有出現(xiàn)字符串的方法。

方式一、使用replace加正則

必須啟用正則表達式上的全局標志，才能使replace()方法替換模式出現(xiàn)的所有內容，我們可以這樣做：

1. 在正則表達式文字中，將g附加到標志部分：/abc/g。
   

2. 對于正則表達式構造函數(shù)，使用 flags 參數(shù):new RegExp(' abc  '， 'g')
   

代碼如下：

str = str.replace(/abc/g, '');

或者：

var find = 'abc';var re = new RegExp(find, 'g');str = str.replace(re, '');

可以通過封裝方法，進一步簡化它。

function replaceAll(str, find, replace) {  return str.replace(new RegExp(find, 'g'), replace);}

注意：正則表達式包含特殊（元）字符，因此在find上面的函數(shù)中盲目傳遞參數(shù)而不對其進行預處理以轉義這些字符是危險的。

因此，為了使上述replaceAll()功能更安全，如果您還包含以下內容，則可以將其修改為以下內容escapeRegExp：

function escapeRegExp(string) {  return string.replace(/[.*+\-?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string}

function replaceAll(str, find, replace) {  return str.replace(new RegExp(escapeRegExp(find), 'g'), replace);}

方式二、replaceAll() 方法

新的提案String.prototype.replaceAll()(在第3階段)將replaceAll()方法引入到 JavaScript 的字符串中。

replaceAll(search, replaceWith)字符串方法用replaceWith替換所有的search字符串，沒有任何變通方法。

let result = "1 abc 2 abc 3".replaceAll("abc", "xyz");// `result` is "1 xyz 2 xyz 3"

但是首先檢查我可以使用或其他兼容性表，以確保您的目標瀏覽器首先添加了對它的支持。

replaceAll的兼容實現(xiàn)：

String.prototype.replaceAll = String.prototype.replaceAll || function(string, replaced) {  return this.replace(new RegExp(string, 'g'), replaced);};

方式三、使用 split 和 join 的方法

不使用任何正則表達式的最簡單方法是 split 和 join，這種方法主要包含二個階段：

1. 使用 split 方法，根據(jù)指定的字符將字符串分成多個部分。

2. 然后使用 join 方法將分割的多個部分連接在一直，并在它們之間插入指定的字符。

作為簡單文字字符串的正則表達式的替代方案，您可以使用：

str = "Test abc test test abc test...".split("abc").join("");

一般模式是

str.split(search).join(replacement)

方法四、利用循環(huán)

基于while循環(huán)的解決方案很慢，通常對小字符串慢約4倍，對長字符串慢約 3000 倍。如下：

while(str.includes("abc")){    str = str.replace("abc", "replaced text");}

學習更多技能

請點擊下方公眾號