正则表达式在javascript中的应用

正则表达式 前端之家
前端之家收集整理的这篇文章主要介绍了正则表达式在javascript中的应用，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

1.正则表达式简介

正则表达式通常用于两种任务：1.验证，2.搜索/替换。用于验证时，通常需要在前后分别加上^和$，以匹配整个待验证字符串；搜索/替换时是否加上此限定则根据搜索的要求而定，此外，也有可能要在前后加上\b而不是^和$，如果是全文搜索还需要在后面加上g

如var reg=/\w*o(\w+)?/gi,i表示不区分大小写。

尊重他人劳动成果转载请说明出处：http://www.jb51.cc/article/p-ucacpiya-oy.html

2.在javascript中使用正则表达式的函数介绍

Javascript中有6个函数可以使用正则表达式：match、exec、test、search、replace、split。

其中match，search,replace,split是String的方法，exec、test是RegExp类的方法

2.1 matcher

match是String的方法stringObj.match(rgExp)，exec是RegExp类的方法

使用正则表达式模式对字符串执行查找，并将包含查找的结果作为数组返回。

stringObj.match(rgExp)
参数
stringObj
必选项。对其进行查找的 String 对象或字符串文字。
rgExp
必选项。为包含正则表达式模式和可用标志的正则表达式对象。也可以是包含正则表达式模式和可用标志的变量名或字符串文字。
其余说明与exec一样，不同的是如果match的表达式匹配了全局标记g将出现所有匹配项，而不用循环，但所有匹配中不会包含子匹配项。

@例子：

<script language="javascript"type="text/javascript">

var objStr= "Yue I lOve you till theend of my life!";

var re=/\w*o(\w+)?/gi;

//该表达式用来匹配一个以/w代表的字符，第二个字符是o,后面有一个字符或者多个字符+表示前面的字符匹配的次数,全局匹配,后面的g表示继续往下走即全局 i表示不区分大小写,相当于 var re = newRegExp("\\w*o(\\w+)?","gi");  双引号要加多一次转义的\\w

var arr=objStr.match(re);

//调用match方法匹配字符串并且如果存在返回数组，如果没有结果返回为null

document.write("匹配前的字符串:"+objStr+"<br>");

if(arr!=null){//如果能匹配成功即arr数组不为空，循环输出结果

for(var i=0;i<arr.length;i++){

      document.write("<li>"+arr[i]);

}

}

</script>


输出结果：

如果表达式改为var re=/\w*o(\w+)?/g;则只输出：you of因为对大小写敏感lOve不匹配

2.2 exec

用正则表达式模式在字符串中查找，并返回该查找结果的第一个值（数组），如果匹配失败，返回null.

如果执行exec方法的正则表达式没有分组（没有括号括起来的内容），那么如果有匹配，他将返回一个只有一个元素的数组，这个数组唯一的元素就是该正则表达式匹配的第一个串;如果没有匹配则返回null。
@例子1：下面两个alert函数弹出的信息是一样的：

JavaScript代码

   <script>
    var str= "cat,hat" ;   
    var reg=/at/; //没有g属性   
    alert(reg.exec(str))   
    alert(str.match(reg))  


 
 

 都是"at"。在这种场合下exec等价于match。但是如果正则表达式是全局匹配（g属性）的，那么以上代码结果不一样了: 
 

@例子2：JavaScript代码
 

<script>

var str= "cat,hat" ;   

var reg=/at/g; //注意g属性  

alert(reg.exec(str))   

alert(str.match(reg))  

<script>
 

 

 

分别是
 "at"
 "at,at"。
 

@例子3：当存在子匹配的情况
 

<script>
 

var str= "cas245ssdt,hs3at" ; 
 

 varreg=/s+(\d+)/g; 
 

 document.write(reg.exec(str)+"<br>"); 
 

 document.write(str.match(reg));</script>
 

@输出：s245,245
 

 s245,s3
 

@解释：第一行输出”s245,245”,是因为exec只会匹配第一个值（数组），而且由于表达式reg里有子表达式（即存在（）），所有exec返回的数组有2个值，一个是表达式完全匹配的，一个是子表达式匹配的（即（\d+））,如果要方便取出可以这样写
 

 Var result = reg.exec(str);
 

 Document.write(“result[0]=”+ result[0]+”; result[1]=”+result[0]);
 

//@输出：result[0]=s245；result[1]=245
 

第2行由于表达式后面加了（g属性），全局匹配，所有输出所有的匹配值s245,s3
 

 

2.3 test
 
 

返回一个 Boolean 值，它指出在被查找的字符串中是否匹配给出的正则表达式。是RegExp类的方法；
 

 
 

var objStr=newString("3e234234!");  

var re = /^e\d+/;  // 必须以e开头

var arr = re.test(objStr);//返回：false

var re = /e\d+/;

var arr = re.test(objStr);//返回：true
 

 

 
 

注意：test()继承正则表达式的lastIndex属性，表达式在匹配全局标志g的时候须注意。
 

代码如下:
 


 
 

function testDemo(){
var r,re; // 声明变量。
var s = "I";
re = /I/ig; // 创建正则表达式模式。
document.write(re.test(s) + "<br/>"); // 返回 Boolean 结果。
document.write(re.test(s) + "<br/>");
document.write(re.test(s));
}
testDemo(); 
 

 

 
 


 输出结果： 
 true 
 false 
 true 
 当第二次调用test()的时候，lastIndex指向下一次匹配所在位置1，所以第二次匹配不成功，lastIndex重新指向0，等于第三次又重新匹配。下例显示test的lastIndex属性：
 例子6：代码如下:
 


 
 

function testDemo(){
var r,re; // 声明变量。
var s = "I";
re = /I/ig; // 创建正则表达式模式。
document.write(re.test(s) + "<br/>"); // 返回 Boolean 结果。
document.write(re.lastIndex); // 返回 Boolean 结果。
}
testDemo(); 
 

 

 
 


 输出： 
 true 
 1 
 解决方法：将test()的lastIndex属性每次重新指向0，re.lastIndex = 0;
 

2.4 search
 
 

返回与正则表达式查找内容匹配的第一个子字符串的位置（偏移位）。0开始，没找到返回-1，与match一样是String 类的方法：stringObj.search(rgExp)
 

@例子：
 

<script>

function SearchDemo(){

var r,re; // 声明变量。

var s = "The rain in Spain fallsmainly in the plain.";

re = /the/i; // 创建正则表达式模式。

re2 = /tom/i;

r = s.search(re); // 查找字符串。

r2 = s.search(re2);

return("r：" + r +"；r2：" + r2);

}

document.write(SearchDemo());

</script>
 

 

 
 

@输出结果：r：0；r2：-1
 

2.5 replace
 
 

返回根据正则表达式进行文字替换后的字符串的复制。是String的方法
 

stringObj.replace(rgExp,replaceText)；注意：replaceText可以是一个方法
 
 

@例子1：替换为特定文字
 

<scriptlanguage="javascript">

var s=prompt("请输入在查找的字符","人");

var reg=/中华/g;

var str="中华人民共2和国，中华人民共和234国";

var newstr=str.replace(reg,"中国");

document.write(newstr);

</script>
 

 @输出：中国人民共2和国，中国人民共和234国 
 

@例子2：匹配字符改颜色（数字改为红色）
 

<scriptlanguage="javascript">

var s=prompt("请输入在查找的字符","人");

var reg=/(\d)/g;

var str="中华人民共2和国，中华人民共和234国";

//$1是根据正则表达式里的（）内容匹配的东西

var newstr=str.replace(reg,"<fontcolor=red>$1</font>");
document.write(newstr);

</script>
 

 @输出： 
 

关于子匹配下下面的介绍：
 
 

 
 

 
  
  
 
    
(pattern)
 		 
    
匹配pattern并获取这一匹配。所获取的匹配可以从产生的Matches集合得到，
 
在VBScript中使用SubMatches集合，在JScript中则使用$0…$9属性。
 
要匹配圆括号字符，请使用“\(”或“\)”。
 		 
  
 
  

 
 
 

@例子3：匹配内容修改
 

<scriptlanguage="javascript">

var str="他今年22岁，她今年20岁，他的爸爸今年45岁，她的爸爸今年44岁，一共有4人"

function test($0)

{

var gyear=(new Date()).getYear()-parseInt($0)+1;

     return $0+"("+gyear+"年出生)";

}

//var reg=new RegExp("(\\d+)岁","g");

reg = /(\d+)岁/g;

var newstr=str.replace(reg,test);

document.write(newstr);

</script>
 

 @输出： 
 
 

看到了吧，有了正则表达式你可以对内容为所欲为。
 
 

@例子4：多匹配
 

<script>

function f2c(s) {

var test =/([\d]{4})-([\d]{1,2})-([\d]{1,2})/;

 return(s.replace(test,kk));

}

function kk($0,$1,$2,$3) {

return($3+"/"+$2 +"/" +$1);

}

document.write("today:2011-03-29<br>");

document.write(f2c("today:2011-03-29"));

</script>
 

 

 

@输出：
 

注意：这里有$0\$1\$2\$3,这是由于表达式有（），表示表达式有子表达式。因为有3个问号所有有3个子表达式。
 

$0取的是跟表示式完全匹配的字符串
 

$1取的是第一个子表达试相匹配的字符串即2011
 

$2取的是第一个子表达试相匹配的字符串即03
 

$3取的是第一个子表达试相匹配的字符串即29
 

2.6 split
 
 

将一个字符串分割为子字符串，然后将结果作为字符串数组返回。 
 stringObj.split([separator[,limit]]) 
 参数 
 stringObj 
 必选项。要被分解的 String 对象或文字。该对象不会被 split 方法修改。 
 separator 
 可选项。字符串或正则表达式 对象，它标识了分隔字符串时使用的是一个还是多个字符。如果忽略该选项，返回包含整个字符串的单一元素数组。 
 limit 
 可选项。该值用来限制返回数组中的元素个数。
 

@例子：
 

<script>

function SplitDemo(){

var s,ss;

var s = "The rain /.,/.in Spain fallsmainly in the plain.";

// 正则表达式，用不分大不写的s进行分隔。

ss = s.split(/\W+/i,5);//后面的5是可选项 表示只返回5个字符串

return(ss);

}

document.write("原值：The rain/.,/.in Spain falls mainly in the plain.<br>");

document.write("分解后："+SplitDemo());

</script>  
 

 @输出： 原文链接：https://www.f2er.com/regex/362830.html

      

      
                 
              

            

          

          
          
          

            

              




            

          


          

            

              

                  
    
猜你在找的正则表达式相关文章



                                    
常用正则表达式-手机号、身份证、邮箱

                                
一、校验数字的表达式 1 数字：^[0-9]*$ 2 n位的数字：^d{n}$ 3 至少n位的数字：^d{n,}$ 4...

                                
                                
                            



                                    
JS正则表达式详解

                                
正则表达式非常有用，查找、匹配、处理字符串、替换和转换字符串，输入输出等。下面整理一...

                                
                                
                            



                                    
组内正则培训记录

                                
0. 注： 不同语言中的正则表达式实现都会有一些不同。下文中的代码示例除特别说明的外，都...

                                
                                
                            



                                    
高级正则表达式技术（Python版）

                                
 正则表达式是从信息中搜索特定的模式的一把瑞士军刀。它们是一个巨大的工具库，其中的...

                                
                                
                            



                                    
史上最全最常用的正则表达式

                                
一、校验数字的表达式 数字：^[0-9]*$ n位的数字：^\d{n}$ 至少n位的数字：^\d{n,...

                                
                                
                            







                                    
正则表达式工具

                                

                                
                                
                            



                                    
正则表达式初步

                                

                                
                                
                            



                                    
分享5个可视化的正则表达式编辑工具

                                
　　正则表达式使用单个字符串来描述、匹配一系列符合某个句法规则的字符串。在很多文本编...

                                
                                
                            



                                    
分享5个可视化的正则表达式编辑工具

                                
正则表达式使用单个字符串来描述、匹配一系列符合某个句法规则的字符串。在很多文本编辑器...

                                
                                
                            



                                    
[知识积累]--正则表达式记忆表

                                
在工作中常常遇到正则表达式问题，有时候又会忘记这则的语法。 下面就分享一份正则表达式记...

                                
                                
                            







            

          

        

        
        
        
        

          
          

            

              

                
                
算法设计模式多媒体技术正则表达式ElasticsearchFlinkHadoopIDE

                

              

            

          

          
         
          

            

              
 



              

            

          

          
          
          
          

            

              

                
                
              

            

          

          


          
          

            

              

                
                
受约束摘*day25Java常用类库置信lamda留存持续录入年后正则表达式303.17regularexpre匹多模适20130322基础理论pathmunge涵义reectok需要转义的特资源分享validationex简明魔法里弄形如源码实现完备actionscript