string.replace 的方法,範例:
var result = "hello".replace("he", "my");
結果
myllo
但這篇主要是講使用 Regular Expression 的 replace,再來個範例:
var result = "hello".replace(/e\w/, "abc");
結果
habclo
沒錯,只要將第一個參數改為 /xxx/ 就是 Regular Expression 的 pattern 囉。
接下來說明 replace 的多載方法
從 mozilla 的 developer 文檔中,看到 String.prototype.replace() 的語法說明
str.replace(regexp|substr, newSubStr|function[, flags])
其中 substr 參數名稱是屬於原本 string 的參數,跟 Regular Expression 無關,
只有第一個參數為 regexp 的時候,才會採用 Regular Expression 的 pattern 來取代字串,
再來示範第二個參數為字串時的範例:
var result = "hello world".replace(/(\w)o/g, "x$1y");
結果
helxly xwyrld
現在來觀察一下 hello world 如何變成 helxly xwyrld 的,
先看 pattern:
/(\w)o/g
- (\w) 只要比對成功就會建立群組,主要看 pattern 有幾個 (),就會建立幾個群組,而且是按照順序給每個群組一個編號(當然也能自己對群組命名)
- (\w)o 會比對 o 文字前面的有個 \w (就是一般文字,像是中文、英文、數字,還有底線)
- g 會將尋找多個成功的比對,沒有 g 就是只找第一個成功的比對
從 hello world 可以找到的為 lo 與 wo 兩個成功的比對,
lo 的群組編號1的值為 l
wo 的群組編號1的值為 w
接著看一下要取代文字的部分 x$1y
x 跟 y 都是要取代的文字,而 $1 是指群組1的值,
也就是說 lo 的要被取代的話,要套入上面定義取代方式,x 加上 l 在加上 y,
其中 $1 就是這個比對成功的 l ,就變成取代為 xly,
wo 就會取代成為 xwy。
再來第二個參數是可以傳入 function 的,
function 參數順序為 比對的成功文字、好幾個群組的值(如果有的話)、比對的索引位置、所有文字,
範例:
var name = 'jerry';
var result = name.replace(/(\we)(\w)/ig, function(value, g1, g2, position, text)
{
return g1;
});
結果
jery
下面是這次範例的的參數
參數1 value: 永遠是比對成功的值: jer
參數2 g1: 因為有 pattern 有 (\we) 群組所建立出來的參數: je
參數3 g2: 因為有 pattern 有 (\w) 群組所建立出來的參數: r
參數4 position: 0,因為 jer 就是在開頭的索引 0
參數5 text:jerry
所以將 jer 取代為 g1 ,也就是 je ,最後會變成 jery。
新手發文,若有錯誤,麻煩回報,感謝。