javascript replace()第二个参数为函数时的参数用法


Posted in Javascript onDecember 26, 2016

javascript的replace()第二个参数为函数时的参数:

replace()函数具有替换功能,它可以具有两个参数,第一个参数可以是要被替换的字符串或者匹配要被替换字符串的正则表达式,第二个参数可以是替换文本或者一个函数,下面看一下关于replace()函数的几个代码实例。
代码实例:
实例一:

<script>
var str="I love 3water and you?";
console.log(str.replace("jb","java"));
</script>

上面的代码只能够替换字符串中的第一个指定子字符串。
实例二:

<script>
var str="I love 3water and you?";
var reg=/jb/g;
console.log(str.replace(reg,"java"));
</script>

上面的代码可以将字符串中的所有指定子字符串替换掉。
实例三:

<script>
var str="I love 3water and you?";
console.log(str.replace("jb",function(){
 return "java"}
));
</script>

上面的代码中,第二个参数是一个函数,可以用此函数的返回值替换字符串中指定的子字符串。当第二个参数为函数的时候,其实这个函数可以传递参数的,下面就通过代码实例介绍一下关于函数的参数问题。
代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>三水点靠木</title>
<script type="text/javascript">
var url = "https://3water.com/o.php?mod=viewthread&tid=14743&extra=page%3D1";
//第一参数为字符串
console.group("字符串");
var oneResult = url.replace("3water.com",function(){
 console.log("replace输入参数:%o",arguments);
 var val = /3water.com/.exec(url);
 
 console.log("exec输出参数:%o",val);
              
 console.assert(arguments[0] === val[0]);
 console.assert(arguments[1] === val["index"]);
 console.assert(arguments[2] === val["input"]);
 return "3water";
});
console.log("replace返回字符串:"+oneResult);
console.groupEnd("字符串");
    
//第一参数为正则表达式
console.group("正则表达式");
var regexp_global = /[?&](\w+)=([^&]*)/g;
var count = 0;
var twoResult = url.replace(regexp_global,function(){
 console.log("第"+(count++)+"次运行");
 console.log("replace输入参数:%o",arguments);
 var val = regexp_global.exec(url);
 console.log("exec输出参数:%o",val);
              
 console.assert(arguments[0] === val[0]);
 console.assert(arguments[1] === val[1]);
 console.assert(arguments[2] === val[2]);
 console.assert(arguments[3] === val["index"]);
 console.assert(arguments[4] === val["input"]);
 return count;
});
console.log("replace返回字符串:"+twoResult);
console.groupEnd("正则表达式");
</script>
</head>
<body>
 
</body>
</html>

在上面的代码中,分别演示了replace()函数第一参数是普通字符串和正则表达式的时候,第二个函数参数传递参数的情况,下面分别做一下简单的说明:
第一个参数是普通字符串:

当第一个参数是普通字符串的时候,那么只会替换原字符串中的第一个子字符串,也就是说只会执行一次替换操作,为函数传递的参数和以普通字符串参数作为正则表达式执行exec()函数返回的数组的元素是相同的。
第一个参数是正则表达式:

由于篇幅原因,这里只是截取了一部分运行结果内容,replace()函数的第一个参数是正则表达式,并且执行的是全局匹配,那么第二个函数参数会多次被调用,每次被调用传递的参数,也是和regexp_global.exec(url)返回的数组的元素内容是相同的。

Javascript 相关文章推荐
javascript concat数组累加 示例
Sep 03 Javascript
40款非常有用的 jQuery 插件推荐(系列一)
Dec 21 Javascript
jQuery 三击事件实现代码
Sep 11 Javascript
Node.js中的事件驱动编程详解
Aug 16 Javascript
Javascript基础知识(一)核心基础语法与事件模型
Sep 29 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
May 26 Javascript
JS 获取HTML标签内的子节点的方法
Sep 21 Javascript
浅谈gulp创建完整的项目流程
Dec 20 Javascript
vue中使用百度脑图kityminder-core二次开发的实现
Sep 26 Javascript
vue 中的 render 函数作用详解
Feb 28 Javascript
Vue解决移动端弹窗滚动穿透问题
Dec 15 Vue.js
教你使用vscode 搭建react-native开发环境
Jul 07 Javascript
javascript prototype原型详解(比较基础)
Dec 26 #Javascript
如何提高数据访问速度
Dec 26 #Javascript
Angular的模块化(代码分享)
Dec 26 #Javascript
详解Angular的数据显示优化处理
Dec 26 #Javascript
easyui combotree加载静态数据问题(选不上)解决方法
Dec 26 #Javascript
手动初始化Angular的模块与控制器
Dec 26 #Javascript
详解Python中logging日志模块在多进程环境下的使用
Dec 26 #Javascript
You might like
一个PHP模板,主要想体现一下思路
2006/12/25 PHP
PHP垃圾回收机制引用计数器概念分析
2013/06/24 PHP
php采用curl模仿登录人人网发布动态的方法
2014/11/07 PHP
PHP获取用户客户端真实IP的解决方案
2016/10/10 PHP
JavaScript 组件之旅(一)分析和设计
2009/10/28 Javascript
原生Js实现按的数据源均分时间点幻灯片效果(已封装)
2010/12/28 Javascript
JS在textarea光标处插入文本的小例子
2013/03/22 Javascript
js中split和replace的用法实例
2015/02/28 Javascript
通过设置CSS中的position属性来固定层的位置
2015/12/14 Javascript
JavaScript html5 canvas画布中删除一个块区域的方法
2016/01/26 Javascript
微信小程序 教程之事件
2016/10/18 Javascript
简单实现js无缝滚动效果
2017/02/05 Javascript
微信小程序商品到详情的实现
2017/06/27 Javascript
微信小程序富文本渲染引擎的详解
2017/09/30 Javascript
vuex的简单使用教程
2018/02/02 Javascript
Vue循环组件加validate多表单验证的实例
2018/09/18 Javascript
详解关于Vue单元测试的几个坑
2020/04/26 Javascript
python抓取京东商城手机列表url实例代码
2013/12/18 Python
Python入门篇之正则表达式
2014/10/20 Python
Python实现简单拆分PDF文件的方法
2015/07/30 Python
CentOS 6.X系统下升级Python2.6到Python2.7 的方法
2016/10/12 Python
解决Matplotlib图表不能在Pycharm中显示的问题
2018/05/24 Python
对Python中画图时候的线类型详解
2019/07/07 Python
Pandas0.25来了千万别错过这10大好用的新功能
2019/08/07 Python
pyMySQL SQL语句传参问题,单个参数或多个参数说明
2020/06/06 Python
Python脚本打包成可执行文件过程解析
2020/10/20 Python
猫咪家具:CatsPlay
2018/11/03 全球购物
咖啡书吧创业计划书
2014/01/13 职场文书
水利学院求职自荐书
2014/02/01 职场文书
英语老师推荐信
2014/02/26 职场文书
六一节目主持词
2014/04/01 职场文书
园林技术专业求职信
2014/07/28 职场文书
小学一年级学生评语大全
2014/12/25 职场文书
《穷人》教学反思
2016/02/19 职场文书
《正面管教》读后有感:和善而坚定的旅程
2019/12/19 职场文书
Python使用永中文档转换服务
2022/05/06 Python