浅谈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 选中文字并响应获取的实现代码
Aug 28 Javascript
Web开发之JavaScript
Mar 29 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 Javascript
Javascript实现颜色rgb与16进制转换的方法
Apr 18 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
Sep 26 Javascript
对js eval()函数的一些见解
Aug 15 Javascript
jquery判断类型是不是number类型的实例代码
Oct 07 Javascript
Vue.js中用v-bind绑定class的注意事项
Dec 13 Javascript
node.js使用zlib模块进行数据压缩和解压操作示例
Feb 12 Javascript
微信小程序学习总结(三)条件、模板、文件引用实例分析
Jun 04 Javascript
SSM VUE Axios详解
Oct 05 Vue.js
JavaScript 对象创建的3种方法
Nov 17 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
火车采集器 免费版使出收费版本功能实现原理
2009/09/17 PHP
在PHP中运行Linux命令并启动SSH服务的例子
2014/06/12 PHP
php实现求相对时间函数
2015/06/15 PHP
javascript跨域的4种方法和原理详解
2014/04/08 Javascript
javascript实现图片循环渐显播放的方法
2015/02/24 Javascript
js实现宇宙星空背景效果的方法
2015/03/03 Javascript
JS实现的左侧竖向滑动菜单效果代码
2015/10/19 Javascript
JavaScript调试的多个必备小Tips
2017/01/15 Javascript
jQuery实现遍历复选框的方法示例
2017/03/06 Javascript
详解vue嵌套路由-query传递参数
2017/05/23 Javascript
vue.js给动态绑定的radio列表做批量编辑的方法
2018/02/28 Javascript
JS简单生成由字母数字组合随机字符串示例
2018/05/25 Javascript
浅谈vue中关于checkbox数据绑定v-model指令的个人理解
2018/11/14 Javascript
vue 内置过滤器的使用总结(附加自定义过滤器)
2018/12/11 Javascript
超详细的5个Shell脚本实例分享(值得收藏)
2019/08/15 Javascript
浅析vue-router实现原理及两种模式
2020/02/11 Javascript
jQuery实现移动端下拉展现新的内容回弹动画
2020/06/24 jQuery
使用Python操作MySQL的一些基本方法
2015/08/16 Python
Python简单实现的代理服务器端口映射功能示例
2018/04/08 Python
python实现对指定输入的字符串逆序输出的6种方法
2018/04/26 Python
python中ASCII码字符与int之间的转换方法
2018/07/09 Python
python爬虫神器Pyppeteer入门及使用
2019/07/13 Python
Python对接六大主流数据库(只需三步)
2019/07/31 Python
Python turtle绘画象棋棋盘
2019/08/21 Python
基于Modernizr 让网站进行优雅降级的分析
2013/04/21 HTML / CSS
微软日本官方网站:Microsoft日本
2017/11/26 全球购物
澳大利亚宠物食品和用品商店:PETstock
2020/01/02 全球购物
AJAX的全称是什么
2012/11/06 面试题
Java如何调用外部Exe程序
2015/07/04 面试题
英语专业学子个人的自我评价
2013/10/02 职场文书
食堂个人先进事迹
2014/01/22 职场文书
小学学校评估方案
2014/06/08 职场文书
2015年中秋晚会主持词
2015/07/01 职场文书
2016先进集体事迹材料范文
2016/02/25 职场文书
宪法宣传标语100条
2019/10/15 职场文书
CentOS MySql8 远程连接实战
2022/04/19 MySQL