>웹 프론트엔드 >JS 튜토리얼 >JavaScript_javascript 스킬의 교체 방법에 대한 자세한 설명

JavaScript_javascript 스킬의 교체 방법에 대한 자세한 설명

WBOY
WBOY원래의
2016-05-16 15:22:311160검색

정의 및 사용법

replace() 메서드는 문자열의 일부 문자를 다른 문자로 바꾸거나 정규식과 일치하는 하위 문자열을 바꾸는 데 사용됩니다.

stringObject.replace(regexp/substr,replacement)

필수입니다. 대체할 하위 문자열이나 패턴을 지정하는 RegExp 개체입니다.

参数 描述
regexp/substr

必需。规定子字符串或要替换的模式的 RegExp 对象。

请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。

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

값이 문자인 경우 주의하세요. 문자열의 경우 먼저 RegExp 개체로 변환되지 않고 리터럴 텍스트 패턴으로 검색됩니다.

교체 필수입니다. 문자열 값. 텍스트를 바꾸거나 대체 텍스트를 생성하는 기능을 지정합니다.
반환값

정규 표현식의 첫 번째 일치 항목 또는 모든 일치 항목을 대체 항목으로 대체하여 얻은 새 문자열입니다.

일반 캐릭터

replaceValue는 문자열일 수 있습니다. 문자열에 특정 문자가 여러 개 있으면 특정 문자열로 변환됩니다.

字符 替换文本
$$ 直接量符号(就是当做'$$'字符用)
$& 与正则相匹配的字符串
$` 匹配字符串左边的字符
$' 匹配字符串右边的字符
,,$,3,…,$n 匹配结果中对应的分组匹配结果

下面通过实例给大家介绍:

例子 1

在本例中,我们将使用 "W3School" 替换字符串中的 "Microsoft":

<script type="text/javascript">
var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/, "W3School"))
</script>

输出:

Visit W3School!

例子 2

在本例中,我们将执行一次全局替换,每当 "Microsoft" 被找到,它就被替换为 "W3School":

<script type="text/javascript">
var str="Welcome to Microsoft! "
str=str + "We are proud to announce that Microsoft has "
str=str + "one of the largest Web Developers sites in the world."
document.write(str.replace(/Microsoft/g, "W3School"))
</script>

输出:

Welcome to W3School! We are proud to announce that W3School
has one of the largest Web Developers sites in the world.

例子 3

您可以使用本例提供的代码来确保匹配字符串大写字符的正确:

text = "javascript Tutorial";
text.replace(/javascript/i, "JavaScript");

例子 4

在本例中,我们将把 "Doe, John" 转换为 "John Doe" 的形式:

name = "Doe, John";
name.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1");

例子 5

在本例中,我们将把所有的花引号替换为直引号:

name = '"a", "b"';
name.replace(/"([^"]*)"/g, "'$1'");

例子 6

在本例中,我们将把字符串中所有单词的首字母都转换为大写:

name = 'aaa bbb ccc';
uw=name.replace(/\b\w+\b/g, function(word){
 return word.substring(0,1).toUpperCase()+word.substring(1);}
 );

正则替换字符串

'I am loser,You are loser'.replace(/loser/g,'hero')
//I am hero,You are hero

使用正则表达式,并将正则的global属性改为true则可以让所有loser都变为hero

使用$&字符给匹配字符加大括号

var sStr='讨论一下正则表达式中的replace的用法';
sStr.replace(/正则表达式/,'{$&}');
//讨论一下{正则表达式}中的replace的用法
使用$`和$'字符替换内容
'abc'.replace(/b/,"$`");
//aac
'abc'.replace(/b/,"$'");
//acc
使用分组匹配组合新的字符串
'nimojs@126.com'.replace(/(.+)(@)(.*)/,"$2$1")
//@nimojs

replaceValue参数可以是一个函数

StringObject.replace(searchValue,replaceValue)中的replaceValue可以是一个函数.

如果replaceValue是一个函数的话那么,这个函数的arguments会有n+3个参数(n为正则匹配到的次数)

先看例子帮助理解:

function logArguments(){  
  console.log(arguments);
//["nimojs@126.com", "nimojs", "@", "126.com", 0, "nimojs@126.com"] 
  return '返回值会替换掉匹配到的目标'
}
console.log(
  'nimojs@126.com'.replace(/(.+)(@)(.*)/,logArguments)
)

参数分别为

匹配到的字符串(此例为nimojs@126.com,推荐修改上面代码的正则来查看匹配到的字符帮助理解)
如果正则使用了分组匹配就为多个否则无此参数。(此例的参数就分别为”nimojs”, “@”, “126.com”。推荐修改正则为/nimo/查看控制台中返回的arguments值)
匹配字符串的对应索引位置(此例为0)
原始字符串(此例为nimojs@126.com)
使用自定义函数将A-G字符串改为小写

'JAVASCRIPT'.replace(/[A-G]/g,function(){
  return arguments[0].toLowerCase();
})
//JaVaScRIPT

使用自定义函数做回调式替换将行内样式中的单引号删除

<span style="font-family:\'微软雅黑\';">demo</span>'.replace(/\'[^']+\'/g,function(){   
  var sResult=arguments[0];
  console.log(sResult);//'微软雅黑'
  sResult=sResult.replace(/\'/g,'');
  console.log(sResult);
//微软雅黑
  return sResult;
})
//<span style="font-family:微软雅黑;">demo</span>

以上内容是小编给大家介绍的avaScript 中的 replace 方法,希望大家喜欢。

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.