浅谈jQuery中replace()方法


Posted in Javascript onMay 13, 2015

今天在读jquery源码时,发现一个以前自己不曾注意过得问题,就是replece()的第二个参数为函数时的问题,以前只是知道replace()的第二个参数可以为函数,但是不知道该怎么操作,今天看到源码里用到了函数作为replace()的第二个参数时,感觉自己读起来比较吃力,于是准备整理下这个函数...

语法

stringObject.replace( regexp/substr, replacement)

返回值

返回一个新的字符串,是用replacement替换了regexp的第一次匹配或所欲匹配之后得到的

当replace()方法的参数replacement是函数时,在这种情况下,每个匹配都调用该函数,函数返回的字符串作为替换文本使用。该函数的第一个参数是匹配模式的字符串。接下来的参数是与模式中的子表达式匹配的字符串,可以有0个或多个这样的参数。接下来的参数是一个整数,声明了匹配在stringObject中出现的位置。最后一个参数是stringObject本身。这席话是抄至w3cschool,对于现在的我来说以上的那段话我看着不是很明白,也不能用自己的话来简单描述下,所以只能用实例来说明这一切

var string = "abc123-ii";

string.replace(/(\d)-([\da-z])/g,function( str1, str2, str3,str4,str5){

         console.log( str1 );// 3-i

         console.log( str2 );// 3(第一个捕获)

         console.log( str3 );// i(第二个不捕获组)

         console.log( str4 );// 5(匹配在string中出现的位置)

         console.log( str5 );// abc123-ii(string本身)

         return "I";

})

以上是今天我在看jquery源码

camelCase: function( string ) {

        return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );

    },

fcamelCase = function( all, letter ) {

        return letter.toUpperCase();

    };

时所引发的一些不明白,感觉现在自己对这个函数懂了的样子

然后现在我又想起不知道在以前什么时候,自已在用repleace()所遇到的对于那时的我来说是怪符号,形如“$1,$2”等等。现在夜来对这一问题来做一个解答了

$1,$2, $3.....表示捕获1,2,3....

var string = "abc123-ii";

console.log(string.replace(/(\d)-([\da-z])/g, "$1")); // 用捕获组1(3)去替换/(\d)-([\da-z])/g
 

$&表示与regexp相匹配的子串

var string = "abc123-ii";

console.log(string.replace(/(\d)-([\da-z])/g, "$&")); // 用与regexp相匹配的字串(3-i)去替换/(\d)-([\da-z])/g

$`表示位于匹配子串左侧的文本

var string = "abc123-ii";

console.log(string.replace(/(\d)-([\da-z])/g, "$`")); // 用匹配字串左侧的文本(abc12)去替换/(\d)-([\da-z])/g

$'表示位于匹配子串右侧的文本

var string = "abc123-ii";

console.log(string.replace(/(\d)-([\da-z])/g, "$‘")); // 用位于匹配字串右侧的文本去替换/(\d)-([\da-z])/g

 $$直接为$符号

var string = "abc123-ii";

console.log(string.replace(/(\d)-([\da-z])/g, "$$")); // 用$符号去替换/(\d)-([\da-z])/g

以上是自己对于replace()方法使用不明确的地方,本人前端小白,如果有写的不对的地方,或者有关于此方法更好用法的实例希望各位看官能够分享...

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
JavaScript数组深拷贝和浅拷贝的两种方法
Apr 16 Javascript
js结合正则实现国内手机号段校验
Jun 19 Javascript
JavaScript事件类型中UI事件详解
Jan 14 Javascript
javascript中eval解析JSON字符串
Feb 27 Javascript
jQuery实现选项卡功能(两种方法)
Mar 08 Javascript
Layui数据表格之获取表格中所有的数据方法
Aug 20 Javascript
详解vue挂载到dom上会发生什么
Jan 20 Javascript
layui的select联动实现代码
Sep 28 Javascript
小程序如何写动态标签的实现方法
Feb 05 Javascript
vue项目,代码提交至码云,iconfont的用法说明
Jul 30 Javascript
详解Vue数据驱动原理
Nov 17 Javascript
JavaScript实现网页留言板功能
Nov 23 Javascript
js实现仿Windows风格选项卡和按钮效果实例
May 13 #Javascript
JS实现模拟风力的雪花飘落效果
May 13 #Javascript
JavaScript实现鼠标点击后层展开效果的方法
May 13 #Javascript
浅谈javascript中的闭包
May 13 #Javascript
jQuery构造函数init参数分析续
May 13 #Javascript
jQuery构造函数init参数分析
May 13 #Javascript
CSS+JS实现点击文字弹出定时自动关闭DIV层菜单的方法
May 12 #Javascript
You might like
php使用exec shell命令注入的方法讲解
2013/11/12 PHP
php冒泡排序、快速排序、快速查找、二维数组去重实例分享
2014/04/24 PHP
PHP自定义错误用法示例
2016/09/28 PHP
定位地理位置PHP判断员工打卡签到经纬度是否在打卡之内
2019/05/23 PHP
PHP反射基础知识回顾
2020/09/10 PHP
实现局部遮罩与关闭原理及代码
2013/02/04 Javascript
js判断鼠标同时离开两个div的思路及代码
2013/05/31 Javascript
jquery衣服颜色选取插件效果代码分享
2015/08/28 Javascript
javascript实现日期时间动态显示示例代码
2015/09/08 Javascript
手机Web APP如何实现分享多平台功能
2016/08/19 Javascript
vue.js select下拉框绑定和取值方法
2018/03/03 Javascript
Node.js API详解之 repl模块用法实例分析
2020/05/25 Javascript
[35:43]2018DOTA2亚洲邀请赛 4.1 小组赛B组 paiN vs Effect
2018/04/03 DOTA
tornado框架blog模块分析与使用
2013/11/21 Python
用Python设计一个经典小游戏
2017/05/15 Python
Python+selenium实现截图图片并保存截取的图片
2018/01/05 Python
分析经典Python开发工程师面试题
2019/04/08 Python
Python3 字典dictionary入门基础附实例
2020/02/10 Python
pycharm 对代码做静态检查操作
2020/06/09 Python
Python Selenium模块安装使用教程详解
2020/07/09 Python
css3实现可滑动跳转的分页插件示例
2014/05/08 HTML / CSS
纯CSS实现右侧底部悬浮效果(悬浮QQ、微信、微博、邮箱等联系方式)
2015/04/24 HTML / CSS
CSS3的calc()做响应模式布局的实现方法
2017/09/06 HTML / CSS
马来西亚时装购物网站:ZALORA马来西亚
2017/03/14 全球购物
Java中实现多态的机制是什么?
2014/12/07 面试题
维德科技C#面试题笔试题
2015/12/09 面试题
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2014/07/21 面试题
学院领导推荐信
2013/10/30 职场文书
物流创业计划书
2014/02/01 职场文书
《搭石》教学反思
2014/04/07 职场文书
婚假请假条怎么写
2014/04/10 职场文书
城管大队整治方案
2014/05/06 职场文书
教导主任竞聘演讲稿
2014/05/16 职场文书
赞美老师的演讲稿
2014/05/22 职场文书
北京故宫导游词
2015/01/31 职场文书
《童年的发现》教学反思
2016/02/18 职场文书