javascript正則表示式RegExp再次研究-replace
阿新 • • 發佈:2019-02-15
昨天說了幾個RegExp的幾個例項屬性
- global 標示正則表示式是否指定了全域性模式g(只讀)
- ignoreCase 標示正則表示式是否指定了不區分大小寫模式i(只讀)
- mutiline 標示正則表示式是否指定了多行模式m(只讀)
- lastIndex 如果使用了全域性模式,這個變數儲存的是在字串中嘗試下次的匹配的偏移值,在test()和exec()中會用到這個值(可寫)
- source 返回建立RegExp物件例項時指定的表示式文字字串。(只讀)
雖然有那麼多屬性,但是基本用不到,為什麼呢?因為這些資訊都包含在模式宣告中了:
字面量建立的正則
var reg = /\[abc\]de/i console.log(reg.global);//=>false console.log(reg.ignoreCase);//=>true console.log(reg.multiline);//=>false console.log(reg.lastIndex);//=>0 console.log(reg.source);//=>\[abc\]de
通過RegExp建構函式建立的也是一樣的結果
var reg2 = new RegExp("\\[bc\\]at","i")
console.log(reg2.global);//=>false
console.log(reg2.ignoreCase);//=>true
console.log(reg2.multiline);//=>false
console.log(reg2.lastIndex);//=>0
console.log(reg2.source);//=>\[abc\]de
replace
說到正則表示式,不得不提replace
stringObject.replace(regexp/substr,replacement)
- 引數1:可以是字串,也可以是正則表示式
- 引數2:可以是字串,也可以是函式。如果它是字串,那麼每個匹配都將由字串替換。但是 replacement 中的 $ 字元具有特定的含義。如下表所示,它說明從模式匹配得到的字串將用於替換。
返回一個新的字串,是用 引數2 替換了 引數1 的第一次匹配或所有匹配之後得到的。
- $1、$2、...、$99 與 regexp 中的第 1 到第 99 個子表示式相匹配的文字。
- $& 與 regexp 相匹配的子串。
- $` 位於匹配子串左側的文字。
- $' 位於匹配子串右側的文字。
- $$ 直接量符號。
replace例一:匹配一次,區分大小寫
var aStr = "Hello 陌上寒!"
var bStr = aStr.replace("陌上寒", "正則表示式")
console.log( bStr)//=>Hello 正則表示式!
replace例二:全域性匹配
var cStr =`你好 陌上寒! 我是陌上寒,我們一起來交流討論前端,每天更新,歡迎關注`
var dStr = cStr.replace(/陌上寒/g, "moshanghan")
console.log(dStr)//=>你好 moshanghan!
//=>我是moshanghan,我們一起來交流討論前端,每天更新,歡迎關注
replace例三:忽略大小寫,匹配一次
var cStr ="我是 Moshanghan! moshanghan是我"
var dStr = cStr.replace(/moshanghan/i, "陌上寒")
console.log(dStr)//=>我是 陌上寒! moshanghan是我
replace例四:忽略大小寫,全域性匹配
var cStr ="我是 Moshanghan! moshanghan是我"
var dStr = cStr.replace(/moshanghan/ig, "陌上寒")
console.log(dStr)//=>我是 陌上寒! 陌上寒是我
加點難度
replace例五:hello, moshanghan轉換為moshanghan hello
以下的輸出是相同的
var name = "hello, moshanghan";
var a = name.replace(/(\w+)\s*,\s*(\w+)/, "$2 $1");
console.log(a);//=>moshanghan hello
var b = name.replace(/(\w+)\s*, (\w+)\s*/, "$2 $1");
console.log(b);//=>moshanghan hello
var c = name.replace(/(\w+), (\w+)/, "$2 $1");
console.log(c);//=>moshanghan hello
var d = name.replace(/(\w*), (\w*)/, "$2 $1");
console.log(d);//=>moshanghan hello
replace例六:
var name = `"a", "b"," dd"`;
var aa = name.replace(/"([^"]*)"/, "'$1'");
console.log(aa); //=>'a', "b"," dd"
console.log(/"([^"]*)"/g.test(name));
replace例七:
var name = 'aaa bbb ccc';
var uw = name.replace(/\b\w+\b/g, function (word) {
return word.substring(0, 1).toUpperCase() + word.substring(1);
});
console.log(uw); //Aaa Bbb Ccc
要理解上面的,有幾個關於正則的概念需要知道
分組
下面的正則表示式可以匹配kidkidkid:
var b =/kidkidkid/
console.log(b.test('kidkidkid')); //=>true
而另一種更優雅的寫法是:
var b =/(kid){3}/
console.log(b.test('kidkidkid')); //=>true
這裡由圓括號包裹的一個小整體稱為分組。
候選
一個分組中,可以有多個候選表示式,用|分隔:
var reg = /I love (him|her|it)/;
console.log(reg.test('I love him'));//=>true
console.log(reg.test('I love her'));//=>true
console.log(reg.test('I love it'));//=>true
console.log(reg.test('I love them'));//=>false
捕獲與引用
被正則表示式匹配(捕獲)到的字串會被暫存起來。其中,由分組捕獲的串會從1開始編號,於是我們可以引用這些串
var reg = /(\d{4})-(\d{2})-(\d{2})/
var date = '2010-04-12'
reg.test(date)
console.log(RegExp.$1);//=>2010
console.log(RegExp.$2);//=>04
console.log(RegExp.$3);//=>12
$1引用了第一個被捕獲的串,$2是第二個,依次類推。
巢狀分組的捕獲
如果碰到類似/((我) 就 (是 (陌上寒)))/的巢狀分組,捕獲的順序是什麼?來試試:
var reg = /((我) 就 (是 (陌上寒)))/
var str = "我 就 是 陌上寒"
reg.test( str ) // true
console.log(RegExp.$1);//=>我 就 是 陌上寒
console.log(RegExp.$2);//=>我
console.log(RegExp.$3);//=>是 陌上寒
console.log(RegExp.$4);//=>陌上寒
規則是以左括號“(”出現的順序進行捕獲。