JavaScript 函数replace深入了解


Posted in Javascript onMarch 14, 2013

replace函数接受两个参数,第一个参数为字符串或正则表达式,第一个参数同样可以接受一个字符串,还可能是一个函数。

      首先对于第一个参数为字符串的我们不再需要多说"I am a boy".replace("boy","girl"),输出:"I am a girl"。在这里想说的是第一个参数为正则的情形。对于正则表达式来说首先会根据是否全局的(全局//g)决定替换行为,如果是全部的则替换全部替换,非全局的只有替换首个匹配的字符串。例如:

"Ha Ha".replace(/\b\w+\b/g, "He")  // He He "Ha Ha".replace(/\b\w+\b/, "He")  //He Ha

1:第二个参数为字符串:

    对于正则replace约定了一个特殊标记符$:

1.$i (i:1-99) : 表示从左到右正则子表达式所匹配的文本。
2.$&:表示与正则表达式匹配的全文本。
3.$`(`:切换技能键):表示匹配字符串的左边文本。
4.$'(‘:单引号):表示匹配字符串的右边文本。
5.$$:表示$转移。
下面来几个demo:

"boy & girl".replace(/(\w+)\s*&\s*(\w+)/g,"$2 & $1") //girl & boy "boy".replace(/\w+/g,"$&-$&") // boy-boy 
"javascript".replace(/script/,"$& != $`") //javascript != java 
"javascript".replace(/java/,"$&$' is ") // javascript is script

2:第二个参数为函数:

      在ECMAScript3推荐使用函数方式,实现于JavaScript1.2.当replace方法执行的时候每次都会调用该函数,返回值作为替换的新值。

     函数参数的规定:

1.第一个参数为每次匹配的全文本($&)。
2.中间参数为子表达式匹配字符串,个数不限.( $i (i:1-99))
3.倒数第二个参数为匹配文本字符串的匹配下标位置。
4.最后一个参数表示字符串本身。
这就是本文所要说replace威力强大的地方,理论的东西都是干货,我们需要示例解决一切空洞的问题:

1:字符串首字母大写:

String.prototype.capitalize = function(){     return this.replace( /(^|\s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase(); 
    } ); 
}; 
console.log("i am a boy !".capitalize())

输出:I Am A Boy !

2:对字符串“张三56分, 李四74分, 王五92分, 赵六84分”的分数提取汇总,算出平均分并输出每个人的平均分差距。

var s = "张三56分, 李四74分, 王五92分, 赵六84分"; var a = s.match(/\d+/g); 
var sum = 0; 
for(var i = 0 ; i < a.length; i++){ 
            sum += parseFloat(a[i]); 
} 
   
var avg = sum / a.length; 
   
function f(){ 
            var n = parseFloat(arguments[1]); 
            return n + "分" + "(" + ((n > avg) ? ("超出平均分" + (n - avg)) : 
                        ("低于平均分" + (avg - n))) + "分)"; 
} 
   
var result = s.replace(/(\d+)分/g, f); 
console.log(result);

输出:

张三56分(低于平均分20.5分), 李四74分(低于平均分2.5分), 王五92分(超出平均分15.5分), 赵六84分(超出平均分7.5分)

       JavaScript的replace函数再加上正则的高级应用,JavaScript的replace将会发回更大的威力所在,在这里将不再深入正则高级应用断言之类的。

出处:http://www.cnblogs.com/whitewolf/

Javascript 相关文章推荐
Ext javascript建立超链接,进行事件处理的实现方法
Mar 22 Javascript
网页源代码保护(禁止右键、复制、另存为、查看源文件)
May 23 Javascript
Javascript动态创建表格及删除行列的方法
May 15 Javascript
深入探讨前端框架react
Dec 09 Javascript
jQuery插件Validate实现自定义表单验证
Jan 18 Javascript
前端js文件合并的三种方式推荐
May 19 Javascript
jQuery中deferred对象使用方法详解
Jul 14 Javascript
socket.io学习教程之基本应用(二)
Apr 29 Javascript
angularjs实现上拉加载和下拉刷新数据功能
Jun 12 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
Mar 09 Javascript
基于vue.js组件实现分页效果
Dec 29 Javascript
vue-router传参用法详解
Jan 19 Javascript
JS异常处理的一个想法(sofish)
Mar 14 #Javascript
JQuery 中几个类选择器的简单使用介绍
Mar 14 #Javascript
document.createElement()用法及注意事项(ff下不兼容)
Mar 13 #Javascript
document.createElement()用法
Mar 13 #Javascript
js获得鼠标的坐标值的方法
Mar 13 #Javascript
JavaScript将Table导出到Excel实现思路及代码
Mar 13 #Javascript
九种js弹出对话框的方法总结
Mar 12 #Javascript
You might like
关于尾递归的使用详解
2013/05/02 PHP
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
ThinkPHP访问不存在的模块跳转到404页面的方法
2014/06/19 PHP
phpnow php探针环境检测代码
2014/11/04 PHP
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
SyntaxHighlighter语法高亮插件使用说明
2011/08/14 Javascript
利用谷歌地图API获取点与点的距离的js代码
2012/10/11 Javascript
js函数在frame中的相互调用详解
2014/03/03 Javascript
使用jquery实现以post打开新窗口
2014/03/19 Javascript
javascript中基本类型和引用类型的区别分析
2015/05/12 Javascript
js实现将选中内容分享到新浪或腾讯微博
2015/12/16 Javascript
使用jQuery.form.js/springmvc框架实现文件上传功能
2016/05/12 Javascript
AngularJS 模型详细介绍及实例代码
2016/07/27 Javascript
AngularJS教程之简单应用程序示例
2016/08/16 Javascript
利用JavaScript判断浏览器类型及版本
2016/08/23 Javascript
使用DeviceOne实现微信小程序功能
2016/12/29 Javascript
JavaScript实现大图轮播效果
2017/01/11 Javascript
vue实现表格数据的增删改查
2017/07/10 Javascript
vue webuploader 文件上传组件开发
2017/09/23 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
2019/03/19 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
2019/11/25 Javascript
Javascript实现鼠标点击冒泡特效
2019/12/24 Javascript
Electron整合React使用搭建开发环境的步骤详解
2020/06/07 Javascript
Vue页面渲染中key的应用实例教程
2021/01/12 Vue.js
[03:03]2014DOTA2西雅图国际邀请赛 Alliance战队巡礼
2014/07/07 DOTA
[02:19]2018年度DOTA2最佳核心位选手-完美盛典
2018/12/17 DOTA
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
Django如何防止定时任务并发浅析
2019/05/14 Python
python数据处理之如何选取csv文件中某几行的数据
2019/09/02 Python
Python3爬虫里关于识别微博宫格验证码的知识点详解
2020/07/30 Python
法人代表任命书范本
2014/06/05 职场文书
推广普通话标语
2014/06/27 职场文书
房屋财产继承协议书范本
2014/11/03 职场文书
关于感谢信的范文
2015/01/23 职场文书
父母教会我观后感
2015/06/17 职场文书
Python+Appium新手教程
2021/04/17 Python