js中string之正则表达式replace方法详解

所属分类: 网络编程 / 正则表达式 阅读数: 288
收藏 0 赞 0 分享

replace方法是javascript涉及到正则表达式中较为复杂的一个方法,严格上说应该是string对象的方法。只不过牵扯到正则的时候比较多一些。需要我们灵活的使用。

语法: stringObj.replace(regexp/substr,replacement);

第一个参数:必需。字符串中要替换的子串或正则RexExp;

第二个参数:必需,一个字符串值,规定了替换文本或生成替换文本的函数。

返回值:注意它的返回值是一个新的字符串,并没有更改原有字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。

所以根据它的参数的不同分为很多种情况,以下一一对各种情况加以分析:

NO.1 两个参数都是字符串

var str1 = '这是一段原始文本,需要替换的内容"这要替换"!';
var newStr = str1.replace('这要替换','need replace');
console.log( newStr );  //输出:  这是一段原始文本,需要替换的内容"need replace"!

上面的例子中第二个参数字符串'need replace',替换掉了第一个参数字符串'这要替换'。这是最简单的一种形式。

NO.2 第一个参数是正则,第二个参数是字符串

var str2 = '这是一段原始文本,需要替换的内容"ac这要替换bb"!';
var newStr = str2.replace( /([a-z])+/g,'qqq' );
console.log( newStr );  //输出:  这是一段原始文本,需要替换的内容"qqq这要替换qqq"!

上面的例子字符串'qqq',替换了正则匹配的内容。如果 regexp 具有全局标志 g,那么 replace() 方法将替换所有匹配的子串。否则,它只替换第一个匹配子串。

NO.3 第一个参数是正则,第二个参数是带$符的字符串

var str3 = '这是一段原始文本,"3c这要替换4d"!';
var newStr = str3.replace( /([0-9])([a-z])/g,"$1" );
console.log( newStr );  //输出:  这是一段原始文本,"3这要替换4"!';

上面的例子,$1表示regexp中的第一个子表示即([0-9])匹配单个数字,同理若是$2则表示第二个子表示即([a-z]);所以,'3c'这个匹配到的整体被第一个子表示说表示的'3'替换,'4d'被第一个子表示匹配的数字'4'所替换。其他几个同理可得:

(/([0-9])([a-z])/g,”$2″)—>////输出: 这是一段原始文本,”c这要替换d”!'; (3c和4d被相应的第二个子表示匹配出来的c和d替换)(/([0-9])([a-z])/g,”$'”)—>////输出: 这是一段原始文本,”这要替换d”!这要替换”!”!'; (3c被3c右侧文本替换,4d右侧是”!替换,所以出现俩次)

NO.4 第一个参数是正则,第二个参数函数

var str4 = '这是一段原始文本,需要替换的内容"aa这要bbb替换ccccc"!';
var newStr = str4.replace( /[a-z]+/g,function ($0){
  var str = '';
  for (var i = 0; i < $0.length; i++) {
    str += '*';
  };
  return str;
} );
console.log( newStr );  //这是一段原始文本,需要替换的内容"**这要***替换*****"!

上面的例子函数的第一个参数为匹配的regexp的整体,根据长度函数返回值为相应替换的文本;

NO.5 第一个参数是正则且有子表达式,第二个参数函数且带有多个参数

var str5 = '这是一段原始文本,需要替换的内容"3c这要替换4d"!';
var newStr = str5.replace( /([0-9])([a-z])/g,function (arg1,arg2,arg3,arg4,arg5){
 console.log( arg1 );
 console.log( arg2 );
 console.log( arg3 );
 console.log( arg4 );
 console.log( arg5 );
} );

输出:

3c
3
c
17
这是一段原始文本,需要替换的内容"3c这要替换4d"!
4d
4
d
23

这是一段原始文本,需要替换的内容"3c这要替换4d"!

上面的例子第一个参数arg1表示匹配的整体,arg2表示第一个子表达式,arg3表示第二个子表达式,接下来的参数arg4是一个整数,声明了表示子匹配在 stringObject 中出现的位置。最后一个参数是 stringObject 本身。

以上就是replace方法各种可能的情况。确实是一个需要深入理解的方法,不过确实也很强大的一个方法,值得深入研究!

更多精彩内容其他人还在看

js中过滤特殊字符的正则表达式

js中用正则表达式 过滤特殊字符 ,校验所有输入域是否含有特殊符号
收藏 0 赞 0 分享

简单的用js实现过滤多余字符的正则表达式

利用正则表达法除去字符串中的重复字符,一个简单的JavaScript正则表达式实例,将一串含有重复字符串中的多余字符滤除掉,请运行查看效果。
收藏 0 赞 0 分享

校验普通电话、传真号码的正则表达式(可以+开头,除数字外,可含有-)

校验普通电话、传真号码:可以“+”开头,除数字外,可含有“-”
收藏 0 赞 0 分享

正则表达式匹配中文与双字节的代码

匹配中文字符与匹配双字节字符的代码,需要的朋友可以参考下。
收藏 0 赞 0 分享

精通JS正则表达式(推荐)

精通JS正则表达式,讲的比较详细,学习正则表达式的朋友可以参考下。
收藏 0 赞 0 分享

用Java正则去掉字符串中重复出现的字符

abcde 顺序可以不一样,也就是去掉重复出现的字符
收藏 0 赞 0 分享

JavaScript常用的正则表达式表单验证代码

验证表单的不同内容用的是不同的正则表达式。客户端验证常用的几个。
收藏 0 赞 0 分享

JavaScript RegExp 正则表达式对象详细说明

RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具。
收藏 0 赞 0 分享

一个正则表达式的看法(?:)

下午和kindle聊天的时候,他让我看一个正则,问我知不知道其中?:的作用,以偶半瓶水的正则功力,不知道杂解释给他听了,单个一个还好理解,一起就不明白了,起码我是没用过..查了下资料,说说我的看法..
收藏 0 赞 0 分享

用于过滤空白字符的几种常见的js正则表达式pattern

用于过滤空白字符的几种常见的正则表达式pattern——在JavaScript中的表现形式
收藏 0 赞 0 分享
查看更多