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 相关文章推荐
jQuery 打造动态下滑菜单实现说明
Apr 15 Javascript
JavaScript原生对象之Number对象的属性和方法详解
Mar 13 Javascript
基于JavaScript的操作系统你听说过吗?
Jan 28 Javascript
第九章之路径分页标签与徽章组件
Apr 25 Javascript
使用jQuery制作浮动工具栏的实例分享
May 13 Javascript
JS图片左右无缝隙滚动的实现(兼容IE,Firefox 遵循W3C标准)
Sep 23 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
Nov 02 Javascript
AngularJS实践之使用ng-repeat中$index的注意点
Dec 22 Javascript
最实用的JS数组函数整理
Dec 05 Javascript
vue-cli项目中使用echarts图表实例
Oct 22 Javascript
JS实现图片切换特效
Dec 23 Javascript
原生js实现移动小球(碰撞检测)
Dec 17 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
在php中使用sockets:从新闻组中获取文章
2006/10/09 PHP
无数据库的详细域名查询程序PHP版(5)
2006/10/09 PHP
php在window iis的莫名问题的测试方法
2013/05/14 PHP
ubuntu12.04使用c编写php扩展模块教程分享
2013/12/25 PHP
php图片缩放实现方法
2014/02/20 PHP
19个超实用的PHP代码片段
2014/03/14 PHP
PHP模板引擎Smarty中变量的使用方法示例
2016/04/11 PHP
Yii2中使用asset压缩js,css文件的方法
2016/11/24 PHP
PHP levenshtein()函数用法讲解
2019/03/08 PHP
IE6与IE7中,innerHTML获取param的区别
2009/03/15 Javascript
jQuery height()、innerHeight()、outerHeight()函数的区别详解
2016/05/23 Javascript
DOM操作和jQuery实现选项移动操作的简单实例
2016/06/07 Javascript
浅谈js中子页面父页面方法 变量相互调用
2016/08/04 Javascript
jQuery多个版本和其他js库冲突的解决方法
2016/08/11 Javascript
微信小程序 增、删、改、查操作实例详解
2017/01/13 Javascript
完美实现js焦点轮播效果(一)
2017/03/07 Javascript
JSONP基础知识详解
2017/03/19 Javascript
基于LayUI实现前端分页功能的方法
2017/07/22 Javascript
详解jQuery设置内容和属性
2019/04/11 jQuery
浅谈react-router@4.0 使用方法和源码分析
2019/06/04 Javascript
layui使用表格渲染获取行数据的例子
2019/09/13 Javascript
在layui框架中select下拉框监听更改事件的例子
2019/09/20 Javascript
Python对list列表结构中的值进行去重的方法总结
2016/05/07 Python
Python基于list的append和pop方法实现堆栈与队列功能示例
2017/07/24 Python
详解python实现小波变换的一个简单例子
2019/07/18 Python
Python使用turtle库绘制小猪佩奇(实例代码)
2020/01/16 Python
Python安装Bs4的多种方法
2020/11/28 Python
学生会竞选演讲稿纪检部
2014/08/25 职场文书
丧事答谢词
2015/01/05 职场文书
介绍信的写法
2015/01/31 职场文书
宾馆前台接待岗位职责
2015/04/02 职场文书
幼儿园教师读书笔记
2015/06/29 职场文书
驻村工作简报
2015/07/20 职场文书
Go语言中的UTF-8实现
2021/04/26 Golang
MySQL高级进阶sql语句总结大全
2022/03/16 MySQL
CSS使用SVG实现动态分布的圆环发散路径动画
2022/12/24 HTML / CSS