如何理解JavaScript正则表达式

如何理解JavaScript正则表达式，相信很多没有经验的人对此束手无策，为此本文总结了问题出现的原因和解决方法，通过这篇文章希望你能解决这个问题。

建网站原本是网站策划师、网络程序员、网页设计师等，应用各种网络程序开发技术和网页设计技术配合操作的协同工作。成都创新互联公司专业提供网站制作、网站设计,网页设计,网站制作(企业站、自适应网站建设、电商门户网站)等服务,从网站深度策划、搜索引擎友好度优化到用户体验的提升,我们力求做到极致!

一、正则表达式创建

1.var reg = /test/;

2.var reg = new RegExp('test');

3.正则表达式的exec方法

var reg = /test/;

var str = 'testrjf';

var res = reg.exec(str);

//会匹配str里面test内容，有就返回匹配的该内容，没有返回null

console.log(res);//数组形式保存test

二、正则表达式模式

这里写一个方法方便后面演示

function execReg(reg,str){

var result = reg.exec(str);

console.log(result);

}1.一片两片三四片，落尽正则全不见{n},{n-1,n},{1,}。

reg = /c{1}/;//匹配一个c

str='cainiao';

execReg(reg,str);//返回c

reg = /c{2}/;//匹配两个连续的c,{n}同理

str1='ccaniao';

str2='cacniao';

execReg(reg,str1);//返回cc

execReg(reg,str2);//返回null，没有两个连续cc

reg = /c{3,4}/;//匹配3个或4连续的c

str1='cccTest';

str2='ccccTest';

execReg(reg,str1);//返回ccc

execReg(reg,str2);//返回cccc。(正则会尽量多的匹配)

reg = /c{1,}/;//匹配1个以上的c。{2,}{3,}...同理

str1='cccTest';

str2='chjjk';

execReg(reg,str1);//返回ccc

execReg(reg,str2);//返回c

reg='/c*/和等同于reg='/c{0,}/

reg='/c+/和等同于reg='/c{1,}/

reg='/c?/和等同于reg='/c{0,1}/

这里在提示一下，正则表达式会尽可能匹配多的目标返回，有4个就不会返回3个

2./^开头,结尾$/

^开头

reg = /^c/;//^表示只匹配字符串的开头

str1='维生素c';

str2='cainiao';

execReg(reg,str1);//结果为null，因为字符串‘ 外汇分析师’的开头并不是c

execReg(reg,str2);//这次则返回c

结尾$

reg = /c$/;//$匹配字符串结尾的字符

str1='cainiao';

str2='维生素c';

execReg(reg,str1);//返回null

execReg(reg,str2);//返回c

3.点“.”

reg = /./;//'.'会匹配字符串中除了换行符\n之外的所有字符

str1='cainiao';

str2='bainiao';

execReg(reg,str1);//正则匹配到了字符c

execReg(reg,str2);//正则匹配到了字符b

reg = /.+/;

str1='blueidea—经典论坛  好_。';

str2='bbs.blueidea.com';

str3='\ncainiao';

execReg(reg,str1);

//返回'blueidea—经典论坛  好_。'所有的字符都被匹配到了

execReg(reg,str2);//返回'bbs.blueidea.com'

execReg(reg,str3);//返回null

4.或“|“

reg = /b|c/;

str1='blueidea';

str2='cainiao';

execReg(reg,str1);//返回b

execReg(reg,str2);//返回c

reg = /^b|c.+/;

str='cainiao';

execReg(reg,str);//返回cainiao，理解成开头b|c然后.+

reg = /^b|c.+/;

str='bbs.blueidea.com';

execReg(reg,str);//返回b，这里看成开头的b或者是c.+

5.括号

reg = /^(b|c).+/;

str='bbs.blueidea.com';

execReg(reg,str);//此时才是开头b|c，然后.+

//回的结果后面多出来一个“,b“，这是()内的b|c所匹配的内容。

//我们在正则表达式内括号里写的内容会被认为是子正则表达式，所匹配的结果也会被记录下来供后面使用。我们暂且不去理会这个特性。

6.字符集合[abc]

reg = /^[abc]/;//[abc]表示a或者b或者c中的任意一个字符

str='bbs.blueidea.com';

execReg(reg,str);//返回b

reg = /^[a-zA-Z][a-zA-Z0-9_]+/;//先^[a-zA-Z]，后[a-zA-Z0-9_]+

str='test';

execReg(reg,str);//返回test

7.反字符集合[^abc]

reg = /[^abc]/;

str='blueidea';

execReg(reg,str);//返回l（即第一个b没有匹配）

即：[^0-9] 表示非数字，[^a-z] 表示非小写字母…

8.边界与非边界

\b表示的边界的意思

reg = /\bc/;//表示字符串开始的c或者是结尾的c

str1='cainiao';

str2='维生素c';

execReg(reg,str1);//返回c，左边界的c

execReg(reg,str2);//返回c，右边界的c

\B表示非边界

reg = /\Bc/;//表示字符串除了开始（结尾）的c

str='aicniao';

execReg(reg,str);//返回c，中间的c

9.数字与非数字

\d表示数字的意思

reg = /\d/;

str='cainiao8';

execReg(reg,str);//返回8

\D表示非数字的意思

reg = /\d/;

str='cainiao8';

execReg(reg,str);//返回c

10.空白

\f匹配换页符，\n匹配换行符，\r匹配回车，\t匹配制表符，\v匹配垂直制表符。

\s匹配单个空格，等同于[\f\n\r\t\v]。

reg = /\s.+/;

str='This is a test  String.';

execReg(reg,str);//返回'is a test  String.',匹配第一个空格以及其后的所有非换行字符。

\S表示非空格字符。

reg = /\S+/;

str='This is a test  String.';

execReg(reg,str);//This，当遇到第一个空格之后，正则就停止匹配

11.单词字符

\w表示单词字符，等同于字符集合[a-zA-Z0-9_]。

reg = /\w+/;

str='.blueidea';

execReg(reg,str);//blueidea

\W表示非单词字符，等效于[^a-zA-Z0-9_]。

reg = /\W+/;

str='中文如何？';

execReg(reg,str);//'中文如何？'

12.反向引用

reg = /(\w)\1/;

str1='blueidea';

str2='bblueidea';

execReg(reg,str1);//返回null

execReg(reg,str2);//bb

//这里的“\1”就叫做反向引用，它表示的是第一个括号内的字正则表达式匹配的内容。

//在上面的例子中，第一个括号(\w)匹配了b，“\1”就同样表示b了，在余下的字符串里自然找不到b了。

13.不记录子正则表达式的匹配结果

使用形如(?:pattern)的正则就可以避免保存括号内的匹配结果

reg = /^(?:b|c).+/;

str='bbs.blueidea.com';

execReg(reg,str);//返回bbs.blueidea.com

//前面提到的括号里子表达式不被保存

14.正向预查

形式：(?=pattern)，即要匹配的字符串，后面必须紧跟着pattern！

reg = /cainiao(?=8)/;//只是后面必须跟着8，但结果不匹配8

str1='cainiao9';

str2='cainiao8';

execReg(reg,str1);//返回null

execReg(reg,str2);//返回cainiao

形式：(?!pattern)和?=恰好相反，要求字符串的后面不能紧跟着某个pattern

reg = /cainiao(?!8)/;

str1='cainiao9';

str2='cainiao8';

execReg(reg,str1);//返回cainiao

execReg(reg,str2);//返回null

15.匹配元字符

*,+,?之类的符号，它们在正则表达式中都有一定的特殊含义，类似这些有特殊功能的字符都叫做元字符。那我们想匹配’c?'这种字符串呢？

reg = /c\?/;

str='c?';

execReg(reg,str);//返回'c?'

三、正则表达式修饰符

1.i: 执行对大小写不敏感的匹配。

var reg = /b/;

var str = 'BBS';

execReg(reg,str);//返回null

var reg = /b/i;

var str = 'BBS';

execReg(reg,str);//B

2.g: 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）

在后面进行讲解

3.m: 执行多行匹配。

reg = /^b/;

str = 'test\nbbs';//有换行

execReg(reg,str);//null

reg = /^b/m;

str = 'test\nbbs';

execReg(reg,str);//返回b,换行后第二行b开头

四、正则表达式方法

1.exec方法

exec方法返回的其实并不是匹配结果字符串，而是一个对象，简单地修改一下execReg函数，来做一个实验就可以印证这一点。

function  execReg(reg,str){

var result =  reg.exec(str);

console.log(typeof result);

reg = /b/;

str='bbs.bblueidea.com';

execReg(reg,str);

//显示result的类型是object。而且是一个类似数组的对象。

其中属性：index input  0。其中index是表示匹配在原字符串中的索引；而input则是表示输入的字符串；至于0则是表示只有一个匹配结果，可以用下标0来引用这个匹配结果，这个数量可能改变。我们可以通过返回值的length属性来得知匹配结果的总数量。

然后修改execReg函数

function  execReg(reg,str){

var result =  reg.exec(str);

console.log('index:'+result.index+'\n'+'input:'+result.input+'\n');

for(i=0;i<1result.length;i++){ style="overflow-wrap: break-word" p=""

console.log('result['+i+']:'+result[i]+'\n');

reg  = /\w/;

str='bbs.bblueidea.com';

execReg(reg,str);

看完上述内容，你们掌握如何理解JavaScript正则表达式的方法了吗？如果还想学到更多技能或想了解更多相关内容，欢迎关注创新互联行业资讯频道，感谢各位的阅读！