也说JavaScript中String类的replace函数


Posted in Javascript onSeptember 22, 2011

对回调函数的参数说明也很准确:
第一个参数是匹配到的字符串,最后一个是原字符串,倒数第二个参数是匹配到的字符串的在原字符串索引的起始位。
但我很好奇,第二到倒数第三之间的参数又是些什么呢?其实,W3school已经给出了答案:

replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。其语法为: 
stringObject.replace(regexp/substr,replacement) 
replacement 可以是字符串,也可以是函数。如果它是字符串,那么每个匹配都将由字符串替换。 
ECMAScript v3 规定,replace() 方法的参数 replacement 可以是函数而不是字符串。在这种情况下,每个匹配都调用该函 
数,它返回的字符串将作为替换文本使用。该函数的第一个参数是匹配模式的字符串。接下来的参数是与模式中的子表达式匹配的 
字符串,可以有 0 个或多个这样的参数。接下来的参数是一个整数,声明了匹配在 stringObject 中出现的位置。最后一个参数 
是 stringObject 本身。

显然,replacement函数的第二到倒数第三之间的参数是“与模式中的子表达式匹配的字符串”,具体个数起决于子表达式的个数。
据此,我们举两个例子来对比说明:
例1:
字符串:"CJ9080"
匹配模式为:/CJ[0-9]{2}/g (无子表达式)
预期结果:
replacement函数有3个参数,分别为:
【0】“CJ90”
【1】0
【2】“CJ9080”
测试代码:
function replaceStr(s) { 
return s.replace(/CJ[0-9]{2}/g, 
function(){ 
for (var i = 0, len = arguments.length; i < len; i++) { 
console.info("Argument " + i + ": " + arguments[i]); 
} 
}); 
};

运行结果:

也说JavaScript中String类的replace函数


例2:
字符串:"CJ9080"
匹配模式为:/((CJ)([0-9]{2}))/g (有3个子表达式:(CJ[0-9]{2}), (CJ), ([0-9]{2}))
预期结果:
replacement函数有6个参数,分别为:
【0】 "CJ90"
【1】 "CJ90"
【2】 "CJ"
【3】 "90"
【4】 0
【5】 "CJ9080"
测试代码:
function replaceStr(s) { 
return s.replace(/((CJ)([0-9]{2}))/g, 
function(){ 
for (var i = 0, len = arguments.length; i < len; i++) { 
console.info("Argument " + i + ": " + arguments[i]); 
} 
}); 
};

运行结果:

也说JavaScript中String类的replace函数


显然,两个测试例子结果均与预期一致。说明,当replace函数的replacement为函数时,此函数的参数各位确如W3school所言:

【0】:匹配模式的字符串;
【1 - (length - 3)】: 与模式中的子表达式匹配的字符串, 0个或多个;
【length - 2】:匹配串在原字符串的索引起始位置,从0开始;
【length - 1】:原字符串。

Javascript 相关文章推荐
防止浏览器记住用户名及密码的简单实用方法
Apr 22 Javascript
JavaScript分秒倒计时器实现方法
Feb 02 Javascript
使用Node.js处理前端代码文件的编码问题
Feb 16 Javascript
JavaScript实现简洁的俄罗斯方块完整实例
Mar 01 Javascript
jQuery动态加载css文件实现方法
Jun 15 Javascript
Bootstrap导航简单实现代码
Mar 06 Javascript
基于vue的验证码组件的示例代码
Jan 22 Javascript
小程序中this.setData的使用和注意事项
Aug 28 Javascript
Vue解决echart在element的tab切换时显示不正确问题
Aug 03 Javascript
微信小程序自定义tabBar的踩坑实践记录
Nov 06 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
ajax请求前端跨域问题原因及解决方案
Oct 16 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 #Javascript
Prototype的Class.create函数解析
Sep 22 #Javascript
Javascript中的this绑定介绍
Sep 22 #Javascript
StringTemplate遇见jQuery冲突的解决方法
Sep 22 #Javascript
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
Sep 22 #Javascript
javascript代码编写需要注意的7个小细节小结
Sep 21 #Javascript
extjs 初始化checkboxgroup值的代码
Sep 21 #Javascript
You might like
PHP Error与Logging函数的深入理解
2013/06/03 PHP
PHP 实现手机端APP支付宝支付功能
2018/06/07 PHP
jquery 插件开发方法小结
2009/10/23 Javascript
在javascript中关于节点内容加强
2013/04/11 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
2014/05/01 Javascript
jQuery入门介绍之基础知识
2015/01/13 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
2015/03/26 Javascript
jQuery控制cookie过期时间的方法
2015/04/07 Javascript
jQuery使用$.ajax提交表单完整实例
2015/12/11 Javascript
node+experss实现爬取电影天堂爬虫
2016/11/20 Javascript
jQuery实现的简单悬浮层功能完整实例
2017/01/23 Javascript
Angularjs实现上传图片预览功能
2017/09/01 Javascript
详解让sublime text3支持Vue语法高亮显示的示例
2017/09/29 Javascript
微信小程序图片轮播组件gallery slider使用方法详解
2018/01/31 Javascript
基于elementUI实现图片预览组件的示例代码
2019/03/31 Javascript
百度小程序之间的页面通信过程详解
2019/07/18 Javascript
详解mpvue开发微信小程序基础知识
2019/09/23 Javascript
koa2 数据api中间件设计模型的实现方法
2020/07/13 Javascript
浅谈vue获得后台数据无法显示到table上面的坑
2020/08/13 Javascript
详解React的回调渲染模式
2020/09/10 Javascript
js实现自定义滚动条的示例
2020/10/27 Javascript
js闭包和垃圾回收机制示例详解
2021/03/01 Javascript
Python备份Mysql脚本
2008/08/11 Python
跟老齐学Python之从格式化表达式到方法
2014/09/28 Python
Python and、or以及and-or语法总结
2015/04/14 Python
Python中的复制操作及copy模块中的浅拷贝与深拷贝方法
2016/07/02 Python
python3中dict(字典)的使用方法示例
2017/03/22 Python
老生常谈python函数参数的区别(必看篇)
2017/05/29 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
html5移动端自适应布局的实现
2020/04/15 HTML / CSS
现代生活方式的家具和装饰:Dot & Bo
2018/12/26 全球购物
意大利自行车商店:Cingolani Bike Shop
2019/09/03 全球购物
党委书记岗位职责
2013/11/24 职场文书
个人总结格式范文
2015/03/09 职场文书
公司行政主管岗位职责
2015/04/09 职场文书
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android