JavaScript中replace()方法的第二個參數解析

語法

string.replace(searchvalue,newvalue)

 

參數值

searchvalue
必須。規定子字符串或要替換的模式的 RegExp 對象。請注意，如果該值是一個字符串，則將它作為要檢索的直接量文本模式，而不是首先被轉換為 RegExp 對象。

newvalue
必需。一個字符串值。規定了替換文本或生成替換文本的函數。

 

返回值

String
一個新的字符串，是用 replacement 替換了 regexp 的第一次匹配或所有匹配之后得到的。

 

第一個參數searchvalue

這個參數比較好理解，要么是字符串要么是正則表達式。上文說的“請注意，如果該值是一個字符串，則將它作為要檢索的直接量文本模式，而不是首先被轉換為 RegExp 對象。”，意思是'/abc/gi'不會被解析為正則對象，即使它跟正則寫法一樣。

本文不說第一個參數，只說第二個參數。

 

第二個參數newvalue

這個參數要么是普通字符串，要么是正則替換表達式字符串，說來說去都是字符串，要么是一個函數。

正則替換表達式

特殊替換字符：

字符 替換文本
$& 與正則相匹配的字符串
$` 匹配字符串左邊的字符
$’ 匹配字符串右邊的字符
$1,$2,$,3,…,$n 匹配結果中對應的分組匹配結果

 

$&

$& 適用於沒有子表達式的情況

var sStr='討論一下正則表達式中的replace的用法';
sStr.replace(/正則表達式/,'《$&》');
// 得到："討論一下《正則表達式》中的replace的用法"

 

$`

匹配字符串左邊的所有字符

var sStr='討論一下正則表達式中的replace的用法';
sStr.replace(/正則表達式/,'《$`》');
// 得到："討論一下《討論一下》中的replace的用法"

 

$'

匹配字符串右邊的所有字符，注意，既然 $' 有單引號，那么外面的引號必須雙引號，如果不可以雙引號，只能把 $' 的單引號轉義。

var sStr='討論一下正則表達式中的replace的用法';
sStr.replace(/正則表達式/,"《$'》");
// 得到："討論一下《中的replace的用法》中的replace的用法"

 

$1, $2, $3, …, $n

依次匹配子表達式

var sStr='討論一下正則表達式中的replace的用法';
sStr.replace(/(正則)(.+?)(式)/,"《$1》$2<$3>");
// 得到："討論一下《正則》表達<式>中的replace的用法"

 

函數

先看arguments的用法：

var sStr='討論一下正則表達式中的replace的用法';
sStr.replace(/(正則).+?(式)/,function() {
    console.log(arguments);
});
// ["正則表達式", "正則", "式", 4, "討論一下正則表達式中的replace的用法"]

 

參數分別為：

• 匹配到的字符串（此例為"正則表達式")

• 如果正則使用了分組匹配就為多個否則無此參數。（此例的參數就分別為 "正則", "式"）

• 匹配字符串的對應索引位置（也就是"正則表達式"的索引位置，此例為4）

• 原始字符串

 

如果加上全局標識符g，則是：

var sStr='討論一下正則表達式中的replace的正則表達式用法';
sStr.replace(/(正則).+?(式)/g,function() {
    console.log(arguments);
});
// ["正則表達式", "正則", "式", 4, "討論一下正則表達式中的replace的正則表達式用法"]
// ["正則表達式", "正則", "式", 19, "討論一下正則表達式中的replace的正則表達式用法"]

 

也就是說，arguments是當前函數的內置屬性，指代當前匹配的參數偽數組。arguments[0]就是當前匹配的字符串。

var sStr='討論一下正則表達式中的replace的正則表達式用法';
sStr.replace(/(正則).+?(式)/g,function() {
    console.log(arguments[0]);
    return arguments[0] + 'a';
});
// 正則表達式
// 正則表達式
// "討論一下正則表達式a中的replace的正則表達式a用法"

函數做參數的優勢，在於可以對arguments做更復雜的操作，而不像只是一個字符串參數那么簡陋。當然，arguments不是必須用，可以不用。

 

原文鏈接： https://www.jianshu.com/p/31bebd90fd1d