当前位置: 首页 > 科技观察

JavaScript中替换所有指定字符的3种方法

时间:2023-03-12 22:23:12 科技观察

在JS中,没有简单的方法来替换所有指定字符。Java中有一个replaceAll(),replaceAll(Stringregex,Stringreplacement))方法使用给定的参数替换来替换字符串中所有匹配给定正则表达式的子串。在最新的JS提案String.prototype.replaceAll()中,它对字符串使用了replaceAll()方法。在提案出来之前,我们先看看在JS中有哪些方法可以实现reaplceAll的效果。第一种方法:使用split和join的方法这种方法主要包括两个阶段:使用split方法,将字符串按照指定的字符分成多个部分。然后使用join方法将拆分的部分连接在一起,并在它们之间插入指定的字符。例如,我们将字符串'1+2+3'中的+替换为-。首先通过split方法按照+分隔符分隔'1+2+3'得到['1','2','3']。然后传递join方法并指定连接字符串-以获得结果“1-2-3”。示例:constsearch='duck';constreplaceWith='goose';constresult='duckduckgo'.split(search).join(replaceWith);result;//=>'goosegoosego''duckduckgo'.split('duck')将字符串拆分为片段:['','','go']。['','','go'].join('goose')在元素之间插入'goose'并将它们连接起来得到'goosegoosego'。最后,我们将这个方法封装到一个辅助函数replaceAll中://=>'ibbi'replaceAll('gogogo!','go','move');//=>'movemovemove!'replaceAll('oops','z','y');//=>'oops'方法需要将字符串转换为数组,然后再转换回字符串。这是一个解决方法,但不是一个好的解决方案。2.使用全局正则表达式replace()String.prototype。replace(regExp,replaceWith)搜索出现的正则表达式regExp,然后使用replaceWith字符串替换所有出现的地方。必须启用正则表达式的全局标志,以便replace()方法替换所有出现的模式,我们可以这样做:在正则表达式文字中,将g附加到标志部分:/search/g。对于正则表达式构造函数,使用flags参数:newRegExp('search','g')我们用鹅替换所有鸭子:constsearchRegExp=/duck/gconstreplaceWith='goose'constresult='duckduckgo'.replace(searchRegExp,replaceWith)result//'goosegoosego'正则表达式文字/duck/g匹配启用glob模式的'duck'字符串。'duckduckgo'.replace(/duck/g,'goose')将所有匹配的/duck/g字符串替换为'goose'。可以通过在正则表达式中添加i标志来忽略大小写:constsearchRegExp=/duck/gi;constreplaceWith='goose';constresult='DUCKduckgo'.replace(searchRegExp,replaceWith);result;//=>'goosegoosego'再次检查出正则表达式:/duck/gi。正则表达式启用不区分大小写的搜索:i和全局标志g。/duck/gi匹配'duck',以及'DUCK','Duck'等。'DUCKduckgo'.replace(/duck/gi,'goose')将/duck/gi匹配的结果替换为'goose'以不区分大小写的方式。虽然正则表达式替换了所有出现的字符串,但我认为这种方法过于繁琐。(1)字符串中的正则表达式在运行时确定搜索字符串时,不方便使用正则表达式方法。从字符串创建正则表达式时,字符必须转义-[]/{}()*+?.\^$|,例子如下:constsearch='+'constsearchRegExp=newRegExp(search,'g')////抛出SyntaxError异常constreplaceWith='-'constresult='5+2+1',replace(searchRegExp,replaceWith)上面的代码片段试图将搜索字符串“+”转换为正则表达式。但是'+'是无效的正则表达式,因此会引发SyntaxError:Invalidregularexpression:/+/异常。(2)string的replace()方法如果replace(search,replaceWith)的第一个参数是一个字符串,那么这个方法只替换search的第一个结果。constsearch='duck';constreplaceWith='goose';constresult='duckduckgo'.replace(search,replaceWith);result;//=>'gooseduckgo''duckduckgo'.replace('duck','goose')只有第一次出现的“鸭子”被替换为“鹅”。3.replaceAll()方法最后,新提议String.prototype.replaceAll()(在第3阶段)将replaceAll()方法引入JavaScript中的字符串。replaceAll(search,replaceWith)字符串方法用replaceWith替换所有搜索字符串,没有任何变通方法。我们用鹅替换所有鸭子:constsearch='duck'constreplaceWith='goose';constresult='duckduckgo'.replaceAll(search,replaceWith);result;//=>'goosegoosego''duckduckgo'.replaceAll('duck','goose')将所有出现的字符串'duck'替换为'goose',这是最直接的解决方案。(1)replaceAll()和replace()的区别字符串方法replaceAll(search,replaceWith)和replace(search,replaceWith)的行为是一样的,除了两点:如果搜索参数是一个字符串,那么replaceAll()用replaceWith替换所有出现的搜索,而replace()只替换第一次出现的搜索。如果搜索参数是非全局正则表达式,则replaceAll()将抛出TypeError异常。4.总结替换所有出现的字符串应该很容易。然而,JavaScript已经很久没有提供这样的方法了。一种方法是通过搜索字符串将字符串拆分为块,重新加入字符串,并将替换字符串放在块之间:string.split(search).join(replaceWith)。这种方法有效,但是很麻烦。另一种方法是将String.prototype.replace()与启用全局搜索的正则表达式一起使用:string.replace(/SEARCH/g,replaceWith)。不幸的是,正则表达式无法在运行时轻松地从字符串生成,因为必须对正则表达式的特殊字符进行转义。处理正则表达式简单替换字符串的方式比较麻烦。最后,String.prototype.replaceAll()方法可以很容易地直接替换所有出现的字符串:string.replaceAll(search,replaceWith)。这是第3阶段的提案,但希望很快会被纳入新的JavaScript标准。我的建议是使用replaceAll()来替换字符串。但是你需要一个polyfill来使用这个方法。