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 相关文章推荐
解决FLASH需要点击激活的代码
Dec 20 Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
JS实现让网页背景图片斜向移动的方法
Feb 25 Javascript
jquery+html5烂漫爱心表白动画代码分享
Aug 24 Javascript
三分钟带你玩转jQuery.noConflict()
Feb 15 Javascript
Vue.js每天必学之组件与组件间的通信
Sep 08 Javascript
jQuery实现的放大镜效果示例
Sep 13 Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
Dec 13 Javascript
详解vue之页面缓存问题(基于2.0)
Jan 10 Javascript
vue实现word,pdf文件的导出功能
Jul 31 Javascript
微信小程序动态添加和删除组件的现实
Feb 28 Javascript
5种方法告诉你如何使JavaScript 代码库更干净
Sep 15 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
MYSQL 小技巧 -- LAST_INSERT_ID
2009/11/24 PHP
php实现分页工具类分享
2014/01/09 PHP
php实现按文件名搜索文件的远程文件查找器
2014/05/10 PHP
dedecms集成财付通支付接口
2014/12/28 PHP
最新最全PHP生成制作验证码代码详解(推荐)
2016/06/12 PHP
jQuery Validation插件remote验证方式的Bug解决
2010/07/01 Javascript
JS window对象的top、parent、opener含义介绍
2013/12/03 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
JS基础随笔(菜鸟必看篇)
2016/07/13 Javascript
深入理解Javascript箭头函数中的this
2017/02/13 Javascript
nodejs实现简单的gulp打包
2017/12/21 NodeJs
vue-cli创建的项目,配置多页面的实现方法
2018/03/15 Javascript
微信小程序提取公用函数到util.js及使用方法示例
2019/01/10 Javascript
vue项目中使用particles实现粒子背景效果及遇到的坑(按钮没有点击响应)
2020/02/11 Javascript
vue在线动态切换主题色方案
2020/03/26 Javascript
js用正则表达式筛选年月日的实例方法
2021/01/04 Javascript
[59:00]DOTA2-DPC中国联赛 正赛 Ehome vs PSG.LGD BO3 第一场 3月7日
2021/03/11 DOTA
python解析json实例方法
2013/11/19 Python
python语音识别实践之百度语音API
2018/08/30 Python
python命令行参数用法实例分析
2019/06/25 Python
python交易记录整合交易类详解
2019/07/03 Python
如何在Django项目中引入静态文件
2019/07/26 Python
python 实现目录复制的三种小结
2019/12/04 Python
Python Dict找出value大于某值或key大于某值的所有项方式
2020/06/05 Python
keras实现多GPU或指定GPU的使用介绍
2020/06/17 Python
python和php哪个更适合写爬虫
2020/06/22 Python
CSS3实现王者荣耀匹配人员加载页面的方法
2019/04/16 HTML / CSS
html5 div布局与table布局详解
2016/11/16 HTML / CSS
美国领先的精品家居照明和装饰产品在线零售商:LightsOnline.com
2018/01/23 全球购物
Infababy英国:婴儿推车、Travel System婴儿车和婴儿汽车座椅销售
2018/05/23 全球购物
牵手50新加坡:专为黄金岁月的单身人士而设的交友网站
2020/08/16 全球购物
幼儿教师个人求职信范文
2013/09/21 职场文书
服装店营销方案
2014/03/10 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
动视暴雪取消疫苗禁令 让所有员工返回线下工作
2022/04/03 其他游戏
CSS文本阴影 text-shadow 悬停效果详解
2022/05/25 HTML / CSS