js字符串替换指定字符

人气:290 ℃/2022-11-30 22:59:55

js字符串替换指定字符的函数是怎样的呢?下面就让我们一起来了解一下吧:

js中字符串替换指定字符所用到的函数一般是replace()方法,replace()方法通常是用于在字符串中用一些字符替换另一些字符,或是替换一个与正则表达式匹配的子串。

具体的语法格式为:

stringObject.replace(regexp/substr,replacement)

参数说明:

regexp/substr必需。规定子字符串或是要替换的模式的 RegExp 对象。不过需要注意的是,若是该值是一个字符串,那么将它作为要检索的直接量文本模式,而并不是首先被转换为RegExp对象。

replacement必需。一个字符串值。规定了替换文本或是生成替换文本的函数。

返回值:

一个新的字符串,通常是使用replacement替换了regexp的第一次匹配或是所有匹配之后得到的。

说明:

字符串stringObject的replace()方法通常执行的是查找并替换的操作。它也就是将在 stringObject 中查找与 regexp 相匹配的子字符串,然后使用replacement来进行替换这些子串。但若是regexp具有全局标志g的话,那么replace()方法将会替换所有匹配的子串,若不然它就只能够替换第一个匹配子串。

参考范例:

若是使用“W3School”替换字符串中的“Microsoft”,那么输入代码为:

<script type="text/javascript">

var str="Visit Microsoft!"

document.write(str.replace(/Microsoft/, "W3School"))

</script>

输出结果为:

Visit W3School!

以上就是小编的分享了,希望能够帮助到大家。

js字符串替换指定位置字符

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

在 JS 没有提供一种简便的方法来替换所有指定字符。 在 Java 中有一个 replaceAll() ,replaceAll(String regex, String replacement))方法使用给定的参数 replacement 替换字符串所有匹配给定的正则表达式的子字符串。

在 JS 最新的提案 String.prototype.replaceAll() 中,它将replaceAll()方法用于字符串。

在该提案还没出来之前,我们来看看在 JS 中有哪些方法可以实现 reaplceAll 的效果。

第一种:使用 split 和 join 的方法

这种方法,主要包含二个阶段:

  1. 使用 split 方法,根据指定的字符将字符串分成多个部分。
  2. 然后使用 join 方法将分割的多个部分连接在一直,并在它们之间插入指定的字符。

例如,我们将字符串'1 2 3'中的 替换为-。首先,通过split方法根据 分割符将'1 2 3'分开,得到['1','2','3']。然后通过 join 方法并指定连接字条-,得到结果'1-2-3'。示例如下:

const search = 'duck';const replaceWith = 'goose';const result = 'duck duck go'.split(search).join(replaceWith);result; // => 'goose goose go'

'duck duck go'.split('duck')将字符串分割成几段:['', ' ', ' go']。['', ' ', ' go'].join('goose') 在元素之间插入'goose'并连接起来,得到'goose goose go'。

最后我们把这种方式封装成一个帮助函数 replaceAll:

function replaceAll(string, search, replace) { return string.split(search).join(replace);}replaceAll('abba', 'a', 'i'); // => 'ibbi'replaceAll('go go go!', 'go', 'move'); // => 'move move move!'replaceAll('oops', 'z', 'y'); // => 'oops'

这种方法需要将字符串转换为数组,然后再转换回字符串。这是一种变通方法,但不是一个好的解决方案。

2. 使用全局正则表达式replace()

String.prototype。replace(regExp, replaceWith)搜索正则表达式regExp出现的情况,然后使用replaceWith字符串替换所有匹配项。

必须启用正则表达式上的全局标志,才能使replace()方法替换模式出现的所有内容,我们可以这样做:

  1. 在正则表达式文字中,将g附加到标志部分:/search/g。
  2. 对于正则表达式构造函数,使用 flags 参数:new RegExp('search', 'g')

我们把所有的duck换成goose:

const searchRegExp = /duck/gconst replaceWith = 'goose'const result = 'duck duck go'.replace(searchRegExp, replaceWith)result // 'goose goose go'

正则表达式文字/duck/g与'duck'字符串匹配,并且启用了全局模式。

'duck duck go'.replace(/duck/g, 'goose')用'goose'替换所有匹配/duck/g字符串。

通过向正则表达式添加i标志,可以忽略大小写:

const searchRegExp = /duck/gi;const replaceWith = 'goose';const result = 'DUCK duck go'.replace(searchRegExp, replaceWith);result; // => 'goose goose go'

再次查看正则表达式:/duck/gi。 正则表达式启用了不区分大小写的搜索:i和全局标志g。 /duck/gi匹配'duck',以及'DUCK','Duck'等。

'DUCK duck go'.replace(/duck/gi, 'goose')以不区分大小写的方式用'goose'替换了/duck/gi`所匹配到的结果。

虽然正则表达式替换了所有出现的字符串,但在我看来,这种方法过于繁琐。

2.1 字符串中的正则表达式

当在运行时确定搜索字符串时,使用正则表达式方法不方便。 从字符串创建正则表达式时,必须转义字符-[] / {}()* ? 。 \ ^ $ |,示例如下:

const search = ' 'const searchRegExp = new RegExp(search, 'g') // // 抛出 SyntaxError 异常const replaceWith = '-'const result = '5 2 1',replace(searchRegExp, replaceWith )

上面的代码片段尝试将搜索字符串' '转换为正则表达式。 但是' '是无效的正则表达式,因此会引发SyntaxError: Invalid regular expression: / /异常。

2.2 字符串的 replace() 方法

如果replace(search, replaceWith)的第一个参数是字符串,那么该方法只替换search的第一个结果。

const search = 'duck';const replaceWith = 'goose';const result = 'duck duck go'.replace(search, replaceWith);result; // => 'goose duck go'

'duck duck go'.replace('duck','goose')仅将'duck'的首次出现替换为'goose'。

3.replaceAll() 方法

最后,新的提案String.prototype.replaceAll()(在第3阶段)将replaceAll()方法引入到 JavaScript 的字符串中。

replaceAll(search, replaceWith)字符串方法用replaceWith替换所有的search字符串,没有任何变通方法。

我们把所有的duck换成goose:

const search = 'duck'const replaceWith = 'goose';const result = 'duck duck go'.replaceAll(search, replaceWith);result; // => 'goose goose go'

'duck duck go'.replaceAll('duck', 'goose')将所有出现的'duck'字符串替换为'goose',这是简单明了的解决方案。

3.1 replaceAll()与replace()的区别

字符串方法replaceAll(search, replaceWith)和replace(search, replaceWith)的行为方式是一样的,除了两件事:

  1. 如果search参数是一个字符串,那么replaceAll()用replaceWith替换所有出现的search,而replace()只替换第一次出现的search。

2.如果search参数是一个非全局正则表达式,那么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来使用这个方法。

你还知道其他替换所有字符串出现的方法吗?欢迎留言讨论。

作者: Dmitri Pavlutin 译者:前端小智 来源:dmitripavlutin

原文:https://dmitripavlutin.com/replace-all-string-occurrences-javascript/

推荐

首页/电脑版/网名
© 2025 NiBaKu.Com All Rights Reserved.