最近捣鼓着学习Js,发现replace()真的很有用,替换功能杠杠的棒。

接下来看看我遇到的问题:

有两个随机给出的字符串,字符串1'xxxxxx',字符串2'====T'(这两个用作示例,其他为随机),根据这两个字符串最后输出'ooooox'。后面会给出测试用例,大家就会明白。

刚开始遇到这个问题的时候我就想这就是合并两个字符串,顺带替换了字符串1。

 var n=drone.length;
var l;
l=lamps.replace(/^(x){n}/,'o');

没错,这就是我开始的思路,以致于我后来死脑筋没转出来自己挖的坑,在替换过程中replace()被我丢弃了没使用。

然后开始动手填自己的坑,开始写方法。

第一种

 function strOperate(lamps, drone){
console.log(lamps.length,drone.length);//打印两个字符串的长度
var str="",lamps;
//根据第二个字符串的长度先把要替换的'o'先保存在字符串中;
for(var i=0;i<drone.length;i++){
str+="o";
}
//数组操作
str=str.split("");
lamps=lamps.split("");
//两个字符串长度比较
var length=lamps.length<str.length?lamps.length:str.length;
for(var i=0;i<length;i++){
lamps[i]=str[i];
}
lamps=lamps.toString().replace(/,/g,"");//字符串替换,
console.log(lamps);
}
strOperate('xxxxxx', '====T')//输出 'ooooox'

这样一个方法写下来不知道浪费了多少时间,而且代码冗长,好悲伤呀。

后来细想,我为什么一定要把自己拴在替换字符串上面呢,可以换一种思路来,就有了以下的方法。

第二种

 function flyBy(lamps, drone){
//转换为数组操作
var l=lamps.split("");
var d=drone.split("");
for(var i=0;i<d.length;i++){
//比较字符串长度大小
if(i<l.length){
l[i]='o';//直接赋值覆盖掉
}
}
console.log(l.join(""));//最后转换输出字符串
}
strOperate('xxxxxx', '====T')// 输出 'ooooox'

虽然这两个方法使用同样的原理,但是第二个方法简单明了而且可读性强,请认准第二个。

第三种使用replace()替换

 function strOperate(lamps, drone){
var str;
if(drone.length>lamps.length){
str='o'.repeat(lamps.length)
}
str=lamps.replace('x'.repeat(drone.length),'o'.repeat(drone.length))
console.log(str);
}
strOperate('xxxxxx', '====T')// 输出 'ooooox'
 //测试用例:
strOperate('xxxxxx', '====T')// 'ooooox'
strOperate('xxxxxxxxx', '==T')// 'oooxxxxxx'
strOperate('xxxxxxxxxxxxxxx', '=========T')// 'ooooooooooxxxxx'
strOperate('xxxx', '====T')// 'oooo'

方法写完了,最后还是要记下笔记的。(认真脸.png)

Replace()方法使用:

strObj.replace(regex/substr[,replacement]);

参数:

substr用一些字符串替换;

regex用一个正则表达式匹配的子串替换;

replacement为参数2,是需要替换的文本或函数;

在网上看到了一个有趣的说法,怎样在正则中传入变量,大家想一想是否跟普通的变量用加号拼接呢?

其实答案很简单,string.replace(new RegExp(key,'g'),"o");利用js的RegExp()对象就行了。

另外还有一些replace()特性没有说明,有兴趣的童鞋可以查查资料。

最后记下这些内容,来提示自己,期待下次提高。

~~~~~~~~~~~~~~~~~~2016/12/27 update~~~~~~~~~~~~~~~~~~

再来补充一下 replace()的回调函数使用!

replace() 方法的第二个参数 replacement 可以是函数,并且每个匹配到的元素都会调用该回调,最后返回的字符串作为替换使用。

先举个例子:

 var string="Hello, I am Mr yt";
var str;
str=string.replace(/[^aeiou\s]\b/gi,function (s){
console.log(s);//string, m r b
return s==s.toLowerCase()?s+'err':s+'ERR';
})
console.log(str);//最后输出"Hello, I amerr Mrerr yterr"

备注:参数s为正则匹配到的子串,最后return的就是替换的子串。

对于有变量的正则replacement 函数有4(n+3)个参数,n为分组的个数;

其中的4个参数可以理解为:

function(m,v,i,s){}

m为匹配到的字符串,v为变量值,i为在原字符串中找到匹配元素的下标索引值,s为原字符串;

Js replace() 方法笔记的更多相关文章

  1. JS replace()方法-字符串首字母大写

    replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. replace()方法有两个参数,第一个参数是正则表达式,正则表达式如果带全局标志/g,则是代表替换 ...

  2. js replace方法第二个参数,远不止你想的那么强大

    js replace() 方法,想必大家都不陌生. 定义和用法: replace()方法用于在字符串中用一些字符替换另一些字符,或者替换一个与正则表达式匹配的子串. stringObject.repl ...

  3. Js replace() 学习笔记

    最近捣鼓着学习Js,发现replace()真的很有用,替换功能杠杠的棒. 接下来看看我遇到的问题: 有两个随机给出的字符串,字符串1'xxxxxx',字符串2'====T'(这两个用作示例,其他为随机 ...

  4. JS replace()方法替换变量(可以对变量进行全文替换)

    转至:http://blog.sina.com.cn/s/blog_6552200b0102ve60.html 事情是这样的: 我要用 JS 替换一个多行文本的关键字 正常,没有变量的时候应该是这样: ...

  5. Js toString()方法笔记

    一.前言 toString()用于将该对象以字符串(string)的形式返回,该方法属于Object对象;也就是说对象都能够使用此方法. 之前所接触的是array.toString()数组转换为字符串 ...

  6. JS replace方法

    var str = '1abc2defg3hijk'; str.replace(/\d/g,function(a,b,c,d){ console.log("a:",a);// 匹配 ...

  7. js replace全部替换的方法

    1.JS replace()方法替换变量(可以对变量进行全文替换) string.replace(new RegExp(key,'g'),"b"); 2.封装 String.pro ...

  8. js的replace方法

    今天在项目中发现,js的replace方法,其实只是替换第一个匹配的字符: 比如 backstreetboy.replace('b','B') 得到的结果是Backstreetboy,只是替换了第一个 ...

  9. js中字符串的replace方法区分单双引号

    今天遇到一问题,js文件中调用字符串的replace方法,不起作用. 后来排查可能觉得replace("<option  value='1'>admin</option&g ...

随机推荐

  1. 原生JS取代一些JQuery方法的简单实现

    原生JS取代一些JQuery方法的简单实现 下面小编就为大家带来一篇原生JS取代一些JQuery方法的简单实现.小编觉得挺不错的,现在就分享给大家,也给大家做个参考.一起跟随小编过来看看吧   1.选 ...

  2. HDU 3401 Trade(斜率优化dp)

    http://acm.hdu.edu.cn/showproblem.php?pid=3401 题意:有一个股市,现在有T天让你炒股,在第i天,买进股票的价格为APi,卖出股票的价格为BPi,同时最多买 ...

  3. HDU 4325 Flowers(树状数组+离散化)

    http://acm.hdu.edu.cn/showproblem.php?pid=4325 题意:给出n个区间和m个询问,每个询问为一个x,问有多少个区间包含了x. 思路: 因为数据量比较多,所以需 ...

  4. React Native 组建之IOS和Android通用抽屉

    /** * Sample React Native App * https://github.com/facebook/react-native * @flow *npm:https://www.np ...

  5. 性能跃升50%!解密自主研发的金融级分布式关系数据库OceanBase 2.0

    小蚂蚁说: 相信大家对蚂蚁金服自主研发的金融级分布式关系数据库OceanBase的故事不再陌生了.在刚刚过去的2018年天猫双11中,成交额2135亿再次创造了新纪录,而支撑今年双11的支付宝核心链路 ...

  6. tarjan 缩点(模板)

    描述: 给定一个n个点m条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 注:允许多次经过一条边或者一个点,但是,重复经过的点,权值只计算一次. 思路: ...

  7. 实现一个键对应多个值的字典(multidict)

    一个字典就是一个键对应一个单值的映射.如果你想要一个键映射多个值,那么你就需要将这多个值放到另外的容器中, 比如列表或者集合里面.比如,你可以像下面这样构造这样的字典: d = { , , ], , ...

  8. CentOS7下搭建Nginx+PHP7的安装配置

    一.安装编译工具及库文件: yum -y install make zlib zlib-devel gcc-c++ libtool openssl openssl-devel 环境要求 nginx是C ...

  9. 1. eclipse异常问题解决办法

    1. 内存溢出问题 问题描述:报错信息 java.lang.OutOfMemoryError: PermGen space 解决办法: 在Tomcat/bin/catalina.bat 文件下加入: ...

  10. 传的参数是url地址时需要特殊处理

    <a href="javascript:;" data-url="{$vo.url}" class="info_generate_qr" ...