本文主要详细介绍javascript正则替换的用法。感兴趣的朋友可以参考一下。

在讲replace的高级应用之前，我们先简单梳理一下JS正则中的几个重要知识点，帮助大家复习一下基础知识，然后讲解一下JS正则表达式在replace中的用法以及几个常见的经典案例。

一、正则表达式的创建

创建JS规则有两种方法：new RegExp()和直接文字。

//使用RegExp对象创建

var regObj=新RegExp((^s )|(s $)， g )；

//使用直接文字创建

var regstr=/(^s)|( s $)/g；

g代表全文匹配，I和M与之相关。I代表匹配时忽略大小写，M代表多行匹配。如果同时使用多个条件，则写成：gmi。

二、()、[]、{} 的区别

函数的作用是提取匹配的字符串。如果表达式中有几个()，就会得到几个对应的匹配字符串。例如，(s)表示一串连续的空格。

[]是定义匹配的字符范围。例如，[a-zA-Z0-9]表示字符文本应该匹配英文字符和数字。

{}一般用来表示比赛的长度。例如，d{3}表示匹配三个空格，d[1，3]表示匹配一到三个空格。

三、^ 和 $

匹配字符串的开头，例如，(A)是匹配以字母A开头的字符串。

$匹配字符串的结尾，例如(b$)匹配以字母b结尾的字符串。

还有一个反转的功能，比如[xyz]表示匹配的字符串不包含xyz。

需要注意的是

四、d s w .

d匹配一个非负整数，相当于[0-9]

s匹配一个空白字符。

w匹配一个英文字母或数字，相当于[0-9a-zA-Z]。匹配除换行符之外的任何字符，换行符相当于[ n]

五、* + ?

*表示前一个元素匹配了0次或更多次，例如，(s*)表示匹配了0个或更多空格。

表示匹配前一个元素一次或多次，例如，(d)表示匹配至少由一个整数组成的字符串。

？表示前一个元素匹配0次或1次，相当于{0，1}，比如(w？)匹配最多由1个字母或数字组成的字符串。

六、test 、match

前面的大多是JS正则表达式语法，而test是用来检查一个字符串是否匹配正则表达式。如果是，则返回true，否则返回false。

/d /。测试( 123 )；//真

/d /。测试( ABC )；//假

Match是常规匹配的结果，作为数组返回。

186a619b28 。match(/ d/g)；//[186,619,28]

以上基本是我经常用到的基础知识，但不是很全面。不常用的就不列了，因为只是摆设，但是混淆了主次！

七、replace

Replace本身是JavaScript string对象的一个方法，它允许接收两个参数：

替换([正则表达式|字符串]，[字符串|函数])

第一个参数可以是普通字符串或正则表达式。

第二个参数可以是普通的字符串或回调函数。

如果第一个参数是RegExp，JS会先提取RegExp的匹配结果，然后用第二个参数逐个替换匹配结果。

如果第二个参数是一个回调函数，它将在每次匹配结果时被回调，并且每次都将传递以下参数：

结果：本次匹配的结果。

$1,$9:如果正则表达式中有几个()，则传递几个参数。$1~$9分别代表本次匹配中each()提取的结果，最多9个。

Offset:记录这场比赛的开始位置。

Source:接受匹配的原始字符串。

下面是一些经常使用replace和JS的常见经典案例：

(1)实现字符串的trim功能，去掉字符串两边的空格。

string . prototype . trim=function(){

//方法1:用“”替换所有匹配的结果

返回this.replace(/(^s )|(s $)/g，function(){

返回“”；

});

//模式二：原理和模式一一样。

return this.replace(/(^s)|( s $)/g， )；

};

s表示以空格开头的连续空白字符，s $表示以空格结尾的连续空白字符，添加()提取匹配结果。因为是|，所以这个表达式最多匹配两个结果集，然后执行两次替换：

string . prototype . trim=function(){

/**

* @param rs:匹配结果

* @param $1:第一个()提取结果

* @param $2:第二个()提取结果

* @param offset:匹配开始位置

* @param source:原始字符串

*/

this.replace(/(^s )|(s $)/g，function(rs，$1，$2，offset，source){

//arguments中的每个元素对应一个参数。

console.log(参数)；

});

};

abcd 。trim()；

输出结果：

[ ， ，未定义，0， abcd ] //第一个匹配结果

[ ，未定义， ，5， abcd ] //第二个匹配结果

(2)从浏览器url中提取参数名称和值，以生成键/值对象

函数getUrlParamObj(){

var obj={ }；

//获取url的参数部分

var params=window . location . search . substr(1)；

//[=]表示连续字符，不带or=，加号()是提取相应的字符串。

params.replace(/([^=])=([^=]*)/gi,function(rs,$1,$2){

obj[$ 1]=$ 2；

});

返回obj

}

/([=])=([=] *)/GI每次匹配一个完整的键/值，比如xxxx=xxx。每当这样的结果匹配时，就会执行回调，传递匹配的键和值，对应于$1和$2。

(3)在字符串的指定位置插入一个新字符串。

string . prototype . insetat=function(str，offset){

//使用RegExp()构造函数创建正则表达式

var regx=new RegExp((。{ offset }))；

return this.replace(regx， $ 1 str)；

};

abcd 。instat( XYZ ，2)；//在B和c之间插入xyz。

abxyzcd

当offset=2时，正则表达式为：(。{2}).这意味着除了n后面跟{2}的任何字符都匹配由数字或字母组成的前两个连续字符。add()会提取匹配的结果，然后通过replace用新的字符串替换匹配的结果，比如：result=result str。

(4)将手机号码1298886666转换成1298886666。

功能电话格式(电话){

tel=String(电话)；

//模式1

return tel . replace(/( d { 3 })( d { 4 })( d { 4 })/，function (rs，$1，$2，$3){

返回$1 $2 $3

});

//模式2

return tel . replace(/( d { 3 })( d { 4 })( d { 4 })/， $ 1 $ 2 $ 3 )；

}

(d{3}d{4}d{4})可以匹配完整的手机号码，分别提取前3位、4-7位和8-11位。$1 $2 $3 是在三个结果集之间加空格形成新的字符串，然后替换完整的手机号。

(5)实现函数escapeHtml对、进行转义。

函数escapeHtml(str) {

//匹配

return str.replace(/[]/g，function(rs) {

开关(rs) {

案例“”:

return lt；

案例“”:

return gt；

案例“”:

返回 amp；

案例 :

返回“quot”；

}

});

}

这就是本文的全部内容，希望对大家的学习有所帮助。