javascript中replace還可以這樣玩
阿新 • • 發佈:2020-07-14
一:常規操作
在平時開發中用replace時,無非就是匹配一個字串,然後替換成要換的,例如↓
"1,2,32".replace(',', '-') //"1-2,32" "1,2,32".replaceAll(',', '-') //"1-2-32"
同樣也可以用正則
"1,2,32".replace(/,/, '-') // "1-2,32" "1,2,32".replace(/,/g, '-') //"1-2-32" 加了g就和replaceAll一樣的功能了
二:$1-9分組操作
除了我們經常使用的replace()
形式stringObject.replace(regexp/substr,replacement)
第二個引數也可以是$1-$9,在替換文本里, 指令碼用 $1 和 $2 表示正則表示式中的小括號匹配項的結果
看例子↓
var re = /(\w+)\s(\w+)/; var str = 'John Smith'; str.replace(re, '$2, $1'); // "Smith, John" RegExp.$1; // "John" RegExp.$2; // "Smith"
$1就是對應正則裡第一個小括號匹配的值,後面以此遞增
那如果我們多寫了一個呢,看下↓
str.replace(re, '$2, $1, $3') // "Smith, John, $3"
他就會以字串的形式替換上,沒有對應的匹配內容,因為前面正則只有兩個小括號分組
三:函式操作
replace
方法的第二個引數也可以是一個函式,形如:
stringObject.replace(regexp/substr,function(){});
這個函式應該有個return
值,表示應該被替換的匹配項。
下面會根據正則的匹配項和捕獲組,分2種情況,總結第二個引數function
的具體用法。
情況1.當只有一個匹配項的(即與模式匹配的字串)情況下
,會向該函式傳遞三個引數:模式的匹配項,模式匹配項在字串中的位置和原始字串,形如:
stringObject.replace( regexp/substr, function(match,pos,originalText){} );
例子↓
var str = "{a},{b}"; str.replace(/\{\w+\}/g,(match,pos,original)=>{ console.log(match); console.log(pos); console.log(original) }) 輸出結果是: {a} 0 {a},{b} {b} 4 {a},{b}
情況2.在正則表示式中定義了多個捕獲組的情況下
,傳遞給函式的引數依次是模式的匹配項,第一個捕獲組的匹配項,第二個捕獲組的匹配項……,但是,最後兩個引數依然是模式的匹配項在字串中的位置和原始字串。
例子↓
var str = "{a},{b}"; str.replace(/\{(\w+)\}/g,(match,capture,pos,original)=>{ console.log(match); console.log(capture); console.log(pos); console.log(original) }) 輸出結果是: {a} a 0 {a},{b} {b} b 4 {a},{b}
其實我們還可以用es6的新語法這樣寫↓