网上有关replace的文章很多了,这里主要聊聊它的第二个参数。阅读本文需要对replace方法有一定了解。W3school=>replace

  我们要把一段字符串中的某些指定字符替换掉,第一时间想到的就是replace方法,他的用法很简单,W3school上讲的清晰易懂。

  replace第一个参数一般放置的是正则表达式,用来匹配想要替换的文本;第二个参数一般我们放入的是字符串,用来替换掉正则匹配到的文本。

  其实replace远比上面说的要强大的多,它的内部已经封装的很完善了,远不是我们想象的那么简单,下面我们就来详细聊聊replace的第二个参数。

  现在要实现一个功能,把HTML中的字符实体转换成它们所对应的字符,比如:"&lt;"转换成对对应字符为:"<"。

  下面我们来看看代码实现:

  

 String.prototype.deentityfy=(function(){
var entity = {
lt:'<',
gt:'>'
};
return function(){
return this.replace(/&([^&;]+);/g,
function(a,b,c,d){
console.log('a:'+a+'---b:'+b+'---c:'+c+'---d:'+d);
var r = entity[b];
return typeof r ==='string' ? r : a ;
})
}
}())
document.write('&lt;h1&gt;我是标题&lt;/h1&gt;'.deentityfy());

  这里得讲讲字符实体,以免下面混淆。

  字符实体是不会当作HTML语句来解析的,比如上面的'&lt;h1&gt;我是标题&lt;/h1&gt;'这一段输出到页面上,我们看到的是这样的:

  

  <h1>只是被浏览器当作字符串输出,而不是标签输出,上面这段代码就是把这些字符实体转换成对应字符,能够被浏览器所编译。

  我们一步步来看上面的代码是怎么实现的。

  首先,给String对象的原型挂载了一个deentityfy方法,这个方法是个自执行函数,使用闭包的形式,函数内的所有内容对外都是不可见的。

  函数内,我们定义了一个entity对象字面量,里面有两个属性,分别对应标签的左右尖括号。

  接下来return一个匿名函数,把我们要做的事写在这个函数内。

  我们调用replace方法,第一个参数放置正则表达式:

/&([^&;]+);/g

  这段正则表达式的匹配规则是:以"&"开头,后面紧跟一个或一个以上不是"&"和";"的字符,以";"结束。后面的g代表全局匹配。(更多有关正则表达式的学习请点击这里

  这里着重说下,正则中的"()"和javascript中运算时使用的"()"概念是不同的,这里的括号术语叫做:捕获括号。简单的说就是把括号内匹配到的字符暂时储存起来,在待会的替换环节可以取出来用。

  接下来详细讲讲replace的第二个参数,也就是本文的重点。

  我们一般是放一个字符串在第二个参数中,直接用于替换所匹配到的字符;还有更高阶的技巧,使用$字符可以取得捕获括号中的内容,再进行相关操作。具体可以查看W3school,里面都有讲。

  还有第三种方法, 给第二个参数传入匿名函数,函数的返回值用做替换的字符。

  匿名函数有4个参数可以传入,当然,这些参数都不是必须要传的。

  第一个参数:正则所匹配到的字符;

  第二个参数:捕获括号所捕获到的字符;

  第三个参数:正则匹配到的每段字符的第一个字符的索引;

  第四个参数:用于匹配的字符串主体;

  我把上面代码的运行结果打印出来大家应该就很清晰了:

  

  接触正则也快三年时间了,一直不知道正则还有这么强大的功能,当然也可能是我孤陋寡闻啦。希望大家永葆一颗学习的心,一起进步。

关于字符串replace方法第二个参数探究的更多相关文章

  1. js replace方法第二个参数,远不止你想的那么强大

    js replace() 方法,想必大家都不陌生. 定义和用法: replace()方法用于在字符串中用一些字符替换另一些字符,或者替换一个与正则表达式匹配的子串. stringObject.repl ...

  2. python字符串replace()方法

    python字符串replace()方法 >>> help(str.replace)Help on method_descriptor:replace(...)    S.repla ...

  3. js中替换字符串(replace方法最简单的应用)

    replace方法的语法是:stringObj.replace(rgExp, replaceText) 其中stringObj是字符串(string),reExp可以是正则表达式对象(RegExp)也 ...

  4. ***php解析JSON二维数组字符串(json_decode函数第二个参数True和False的区别)

    客户端的请求体中的数据:[{"msg_id": 1, "msg_status": "HAS_READ" }, { "msg_id& ...

  5. JavaScript系列:replace()函数(第二个参数为函数)

    语法 stringobject.replace(regexp/substr,replacement) 只讲解这个:参数replacement为函数时,这个参数函数的参数代表的意义,以及运行次数,及过程 ...

  6. [JS高程] 字符串模式匹配方法

    目录 1. RegExp 对象 2. 字符串模式匹配方法 2.1 match() , search() 2.2 replace() 2.2.1 第二个参数为字符串的应用情况 2.2.2 第二个参数为函 ...

  7. 字符串的replace()方法隐藏着什么不可告人秘密?

    最近在做JS算法项目时发现一个令我匪夷所思的问题, 这里想记录一下问题. 首先介绍一下字符串replace()方法的基本用法. replace() 方法使用一个替换值(replacement)替换掉一 ...

  8. replace函数结合正则表达式实现转化成驼峰与转化成连接字符串的方法

    //连接符转成驼峰写法 function toCamel(str){ var reg=/-(\w)/g; return str.replace(reg,function(){ return argum ...

  9. 使用 runtime 实现字符串转方法,并传递参数

    利用runtime的动态机制实现字符串转方法并传递参数 使用 SEL 关键字引用方法声明,使用 methodForSelector 寻找方法实现, 使用函数指针调用方法. - (void)action ...

随机推荐

  1. C/C++/Qt 统计运行时间

    http://www.cnblogs.com/Romi/archive/2012/04/19/2457175.html 程序中经常需要统计时间,需要统计某项运算的运行时间时,需要计算时间差. 1. C ...

  2. 跟随标准与Webkit源码探究DOM -- 获取元素之querySelector,querySelectorAll

    使用CSS选择器获取元素 -- querySelector,querySelectorAll(HTML5) 标准 W3C Selector API Level 1为Document,DocumentF ...

  3. 解析Javascript中大括号“{}”的多义性

    JS中大括号有四种语义作用 语义1,组织复合语句,这是最常见的 复制代码 代码如下: if( condition ) {   //... }else {   //... } for() {   //. ...

  4. Android studio动态调试smali

    前面介绍了使用IDA动态调试smali,这种方法设置简单,不用重打包,用起来方便,但是如果变量类型设置错误则会马上退出调试,这是让人不爽的地方,而使用Android studio则不会.   0x01 ...

  5. 【Android菜鸟学习之路】环境搭建问题-修改AVD Path

    更改avd默认路径

  6. java中DatagramSocket连续发送多个数据报包时产生丢包现象解决方案

    try { //向指定的ip和端口发送数据~! //先说明一下数据是谁发送过来的! byte[] ip = InetAddress.getLocalHost().getHostAddress().ge ...

  7. 【转载】VMware下LINUX的虚拟机增加磁盘空间

    转载自:http://space.itpub.net/24435147/viewspace-694200 VMware6.7安装目录下有一个命令行工具vmware-vdiskmanager.exe 程 ...

  8. 【转载】Linux中强大且常用命令:find、grep

    转载自:http://www.linuxeden.com/html/softuse/20130804/142065.html 在linux下面工作,有些命令能够大大提高效率.本文就向大家介绍find. ...

  9. Network - 工具列表

    Tcpdump homepage - tcpdump wiki - tcpdump Wireshark homepage - wireshark wiki - wireshark Fiddler ho ...

  10. 前端引擎初步设计稿 -通过配置生成动态页面 ,LandaSugar平台 .NET-C#-MVC

    公司准备开发出一款项目开发平台 LandaSugar,分为 前端引擎.工作引擎.数据引擎 三大块,开发人员只需要对三大模块进行相应的配置便能够完成一个定制项目的开发. 听起来貌似是异想天开,但是是否真 ...