谁知道JavaScript正则表达式该怎么解析

发布时间:2025-05-19 18:05:34 发布人:远客网络

一、谁知道JavaScript正则表达式该怎么解析

正则表达式是一个描述字符模式的对象。

JavaScript的RegExp对象和String对象定义了使用正则表达式来执行强大的模式匹配和文本检索与替换函数的方法.在JavaScript中,正则表达式是由一个RegExp对象表示的.当然,可以使用一个RegExp()构造函数来创建RegExp对象,也可以用JavaScript 1.2中的新添加的一个特殊语法来创建RegExp对象.就像字符串直接量被定义为包含在引号内的字符一样,正则表达式直接量也被定义为包含在一对斜杠(/)之间的字符.所以,JavaScript可能会包含如下的代码:var pattern=/s$/;这行代码创建一个新的RegExp对象,并将它赋给变量parttern.这个特殊的RegExp对象和所有以字母"s"结尾的字符串都匹配.用RegExp()也可以定义一个等价的正则表达式,代码如下:var pattern= new RegExp("s$");无论是用正则表达式直接量还是用构造函数RegExp(),创建一个RegExp对象都是比较容易的.较为困难的任务是用正则表达式语法来描述字符的模式.JavaScript采用的是Perl语言正则表达式语法的一个相当完整的子集.正则表达式的模式规范是由一系列字符构成的.大多数字符(包括所有字母数字字符)描述的都是按照字面意思进行匹配的字符.这样说来,正则表达式/java/就和所有包含子串"java"的字符串相匹配.虽然正则表达式中的其它字符不是按照字面意思进行匹配的,但它们都具有特殊的意义.正则表达式/s$/包含两个字符.第一个特殊字符"s"是按照字面意思与自身相匹配.第二个字符"$"是一个特殊字符,它所匹配的是字符串的结尾.所以正则表达式/s$/匹配的就是以字母"s"结尾

的字符串.1.直接量字符我们已经发现了,在正则表达式中所有的字母字符和数字都是按照字面意思与自身相匹配的.JavaScript的正则表达式还通过以反斜杠(\)开头的转义序列支持某些非字母字符.例如,序列"\n"在字符串中匹配的是一个直接量换行符.在正则表达式中,许多标点符号都有特殊的含义.下面是这些字符和它们的含义:正则表达式的直接量字符字符匹配

________________________________

\ XXX由十进制数 XXX指定的ASCII码字符

\ Xnn由十六进制数 nn指定的ASCII码字符

\ cX控制字符^X.例如,\cI等价于\t,\cJ等价于\n如果想在正则表达式中使用特殊的标点符号,必须在它们之前加上一个"\".2.字符类将单独的直接符放进中括号内就可以组合成字符类.一个字符类和它所包含的任何一个字符都匹配,所以正则表达式/ [abc]/和字母"a","b","c"中的任何一个都匹配.另外还可以定义否定字符类,这些类匹配的是除那些包含在中括号之内的字符外的所有字符.定义否定字符尖时,要将一个 ^符号作为从左中括号算起的第一个字符.正则表达式的集合是/ [a-zA-z0-9]/.由于某些字符类非常常用,所以JavaScript的正则表达式语法包含一些特殊字符和转义序列来表示这些常用的类.例如,\s匹配的是空格符,制表符和其它空白符,\s匹配的则是空白符之外的任何字符.正则表灰式的字符类字符匹配

.除了换行符之外的任意字符,等价于[^\n]

\w任何单字字符,等价于[a-zA-Z0-9]

\W任何非单字字符,等价于[^a-zA-Z0-9]

\s任何空白符,等价于[\ t\ n\ r\ f\ v]

\S任何非空白符,等价于[^\ t\ n\ r\ f\ v]

\D除了数字之外的任何字符,等价于[^0-9]

[\b]一个退格直接量(特例)3.复制用以上的正则表式的语法,可以把两位数描述成/\ d\ d/,把四位数描述成/\d\ d\ d\ d/.但我们还没有一种方法可以用来描述具有任意多数位的数字或者是一个字符串.这个串由三个字符以及跟随在字母之后的一位数字构成.这些复杂的模式使用的正则表达式语法指定了该表达式中每个元素要重复出现的次数.指定复制的字符总是出现在它们所作用的模式后面.由于某种复制类型相当常用.所以有一些特殊的字符专门用于表示它们.例如:+号匹配的就是复制前一模式一次或多次的模式.下面的表列出了复制语法.先看一个例子:/\d{2, 4}///匹配2到4间的数字./\w{3}\d?///匹配三个单字字符和一个任意的数字./\s+java\s+///匹配字符串"java",并且该串前后可以有一个或多个空格./[^"]*///匹配零个或多个非引号字符.

正则表达式的复制字符字符含义{n, m}匹配前一项至少n次,但是不能超过m次

?匹配前一项0次或1次,也就是说前一项是可选的.等价于{0, 1}

+匹配前一项1次或多次,等价于{1,}

*匹配前一项0次或多次.等价于{0,}4.选择,分组和引用正则表达式的语法还包括指定选择项,对子表达式分组和引用前一子表达式的特殊字符.字符|用于分隔供选择的字符.例如:/ab|cd|ef/匹配的是字符串"ab",或者是字符串"cd",又或者"ef"./\d{3}|[a-z]{4}/匹配的是要么是一个三位数,要么是四个小写字母.在正则表达式中括号具有几种作用.它的主要作用是把单独的项目分组成子表达式,以便可以像处理一个独立的单元那种用*、+或?来处理那些项目.例如:/java(script)?/匹配的是字符串"java",其后既可以有"script",也可以没有./(ab|cd)+|ef)/匹配的既可以是字符串"ef",也可以是字符串"ab"或者"cd"的一次或多次重复.在正则表达式中,括号的第二个用途是在完整的模式中定义子模式。当一个正则表达式成功地和目标字符串相匹配时,可以从目标串中抽出和括号中的子模式相匹配的部分.例如,假定我们正在检索的模式是一个或多个字母后面跟随一位或多位数字,那么我们可以使用模式/ [a-z]+\ d+/.但是由于假定我们真正关心的是每个匹配尾部的数字,那么如果我们将模式的数字部分放在括号中(/ [a-z]+(\d+)/),我们就可以从所检索到的任何匹配中抽取数字了,之后我们会对此进行解析的.代括号的子表达式的另一个用途是,允许我们在同一正则表达式的后面引用前面的子表达式.这是通过在字符串\后加一位或多位数字来实现的.数字指的是代括号的子表达式在正则表达式中的位置.例如:\1引用的是第一个代括号的子表达式.\3引用的是第三个代括号的子表达式.注意,由于子表达式可以嵌套在其它子表达式中,所以它的位置是被计数的左括号的位置.例如:在下面的正则表达式被指定为\2:

/([Jj]ava([Ss]cript))\sis\s(fun\w*)/

对正则表达式中前一子表达式的引用所指定的并不是那个子表达式的模式,而是与那个模式相匹配的文本.这样,引用就不只是帮助你输入正则表达式的重复部分的快捷方式了,它还实施了一条规约,那就是一个字符串各个分离的部分包含的是完全相同的字符.例如:下面的正则表达式匹配的就是位于单引号或双引号之内的所有字符.但是,它要求开始和结束的引号匹配(例如两个都是双引号或者都是单引号):/['"] [^'"]*['"]/

如果要求开始和结束的引号匹配,我们可以使用如下的引用:/( ['"]) [^'"]*\1/\1匹配的是第一个代括号的子表达式所匹配的模式.在这个例子中,它实施了一种规约,那就是开始的引号必须和结束的引号相匹配.注意,如果反斜杠后跟随的数字比代括号的子表达式数多,那么它就会被解析为一个十进制的转义序列,而不是一个引用.你可以坚持使用完整的三个字符来表示转义序列,这们就可以避免混淆了.例如,使用\044,而不是\44.下面是正则表达式的选择、分组和引用字符:字符含义

|选择.匹配的要么是该符号左边的子表达式,要么它右边的子表达式

(...)分组.将几个项目分为一个单元.这个单元可由*、+、？和|等符号使用,而且还可以记住和这个组匹配的字符以供此后引用使用

\n和第n个分组所匹配的字符相匹配.分组是括号中的子表达式(可能是嵌套的).分组号是从左到右计数的左括号数5.指定匹配的位置我们已经看到了,一个正则表达式中的许多元素才能够匹配字符串的一个字符.例如:\s匹配的只是一个空白符.还有一些正则表达式的元素匹配的是字符之间宽度为0的空间,而不是实际的字符例如:\b匹配的是一个词语的边界,也就是处于一个/w字字符和一个\w非字字符之间的边界.像\b这样的字符并不指定任何一个匹配了的字符串中的字符,它们指定的是匹配所发生的合法位置.有时我们称这些元素为正则表达式的锚.因为它们将模式定位在检索字符串中的一个特定位置.最常用的锚元素是 ^,它使模式依赖于字符串的开头,而锚元素$则使模式定位在字符串的末尾.例如:要匹配词"javascript",我们可以使用正则表达式/^ javascript$/.如果我们想检索"java"这个词自身(不像在"javascript"中那样作为前缀),那么我们可以使用模式/\s java\s/,它要求在词语java之前和之后都有空格.但是这样作有两个问题.第一:如果"java"出现在一个字符的开头或者是结尾.该模式就不会与之匹配,除非在开头和结尾处有一个空格.第二:当这个模式找到一个与之匹配的字符时,它返回的匹配的字符串前端和后端都有空格,这并不是我们想要的.因此,我们使用词语的边界\b来代替真正的空格符\s进行匹配.结果表达式是/\b java\b/.下面是正则表达式的锚字符:

^匹配的是字符的开头,在多行检索中,匹配的是一行的开头

$匹配的是字符的结尾,在多行检索中,匹配的是一行的结尾

\b匹配的是一个词语的边界.简而言之就是位于字符\w和\w之间的位置(注意:[\b]匹配的是退格符)

\B匹配的是非词语的边界的字符6.属性有关正则表达式的语法还有最后一个元素,那就是正则表达式的属性,它说明的是高级模式匹配的规则.和其它正则表达式语法不同,属性是在/符号之外说明的.即它们不出现在两个斜杠之间,而是位于第二个斜杠之后.javascript 1.2支持两个属性.属性 i说明模式匹配应该是大小写不敏感的.属性 g说明模式匹配应该是全局的.也就是说,应该找出被检索的字符串中所有的匹配.这两种属性联合起来就可以执行一个全局的,大小写不敏感的匹配.例如:要执行一个大小不敏感的检索以找到词语"java"(或者是"java"、"JAVA"等)的第一个具体值,我们可以使用大小不敏感的正则表达式/\b java\b/i.如果要在一个字符串中找到"java"所有的具体值,我们还可以添加属性 g,即/\b java\b/gi.以下是正则表达式的属性:

g执行一个全局的匹配,简而言之,就是找到所有的匹配,而不是在找到第一个之后就停止了除属性 g和 i之外,正则表达式就没有其它像属性一样的特性了.如果将构造函数 RegExp的静态属性 multiline设置为 true,那么模式匹配将以多行的模式进行.在这种模式下,锚字符 ^和$匹配的不只是检索字符串的开头和结尾,还匹配检索字符串内部的一行的开头和结尾.例如:模式/Java$/匹配的是"Java",但是并不匹配"Java\nis fun".如果我们设置了 multiline属性,那么后者也将被匹配:RegExp.multiline= true;正则表达式(regular expression)对象包含一个正则表达式模式(pattern)。它具有用正则表达式模式去匹配或代替一个串(string)中特定字符(或字符集合)的属性(properties)和方法(methods)。要为一个单独的正则表达式添加属性,可以使用正则表达式构造函数(constructor function)，无论何时被调用的预设置的正则表达式拥有静态的属性(the predefined RegExp object has static properties that are set whenever any regular expression is used,我不知道我翻得对不对，将原文列出，请自行翻译)。创建：

一个文本格式或正则表达式构造函数

正则表达式构造函数： new RegExp("pattern"[,"flags"]);

[注意]文本格式的参数不用引号，而在用构造函数时的参数需要引号。如：/ab+c/i new RegExp("ab+c","i")是实现一样的功能。在构造函数中，一些特殊字符需要进行转意(在特殊字符前加"\")。如：re= new RegExp("\\w+")正则表达式中的特殊字符字符含意

\做为转意，即通常在"\"后面的字符不按原来意义解释，如/b/匹配字符"b"，当b前面加了反斜杆后/\b/，转意为匹配一个单词的边界。

对正则表达式功能字符的还原，如"*"匹配它前面元字符0次或多次，/a*/将匹配a,aa,aaa，加了"\"后，/a\*/将只匹配"a*"。

^匹配一个输入或一行的开头，/^a/匹配"an A"，而不匹配"An a"

$匹配一个输入或一行的结尾，/a$/匹配"An a"，而不匹配"an A"

*匹配前面元字符0次或多次，/ba*/将匹配b,ba,baa,baaa

+匹配前面元字符1次或多次，/ba*/将匹配ba,baa,baaa

?匹配前面元字符0次或1次，/ba*/将匹配b,ba

(x)匹配x保存x在名为$1...$9的变量中

[xyz]字符集(character set)，匹配这个集合中的任一一个字符(或元字符)

[^xyz]不匹配这个集合中的任何一个字符

\cX这儿，X是一个控制符，/\cM/匹配Ctrl-M

\d匹配一个字数字符，/\d/=/[0-9]/

\D匹配一个非字数字符，/\D/=/[^0-9]/

\s匹配一个空白字符，包括\n,\r,\f,\t,\v等

\S匹配一个非空白字符，等于/[^\n\f\r\t\v]/

\w匹配一个可以组成单词的字符(alphanumeric，这是我的意译，含数字)，包括下划线，如[\w]匹配"$5.98"中的5，等于[a-zA-Z0-9]

\W匹配一个不可以组成单词的字符，如[\W]匹配"$5.98"中的$，等于[^a-zA-Z0-9]。

二、Javascript中replace方法与正则表达式的结合使用教程

1、在前端开发中，replace方法是处理字符串时不可或缺的工具。本文通过实例解析replace方法与正则表达式的结合使用，展示了如何灵活地实现字符串处理。首先介绍replace方法的基本用法，它接受两个参数：一个正则表达式或字符串作为模式，以及一个用于替换的字符串或函数。

2、当模式为字符串时，仅替换第一个匹配项；当模式为正则表达式时，可以全文搜索并替换所有匹配项。replace方法的返回值是一个被替换后的字符串。特殊变量如$$、$`、$'、$n和$用于插入匹配内容或其周边文本。其中，$n表示第n个括号匹配的字符串，而$表示当前匹配的子串。

3、接下来，通过实例演示如何使用replace方法进行字符串关键字高亮显示。将需要高亮的关键字包上标签，具体代码如下：

4、"The replace() method returns a new string with some or all matches of a pattern replaced by a replacement. The pattern can be a string or a RegExp, and the replacement can be a string or a function called for each match. If pattern is a string, only the first occurrence will be replaced.".

5、replace(/(replace|pattern|replacement)/ig,"span class='highlight'$1\/span")

6、通过上述代码，可以将replace()方法中涉及的关键字替换为带高亮的文本。这里的$1表示第一个匹配的原子组内容。

7、此外，还可以通过创建正则表达式对象实现更灵活的替换。例如：

8、var str="(replace\$\$|pattern|replacement)";

9、var reg= new RegExp(str,"gi");

10、"The replace() method returns a new string with some or all matches of a pattern replaced by a replacement. The pattern can be a string or a RegExp, and the replacement can be a string or a function called for each match. If pattern is a string, only the first occurrence will be replaced.".

11、replace(reg,"span class='highlight'$1\/span")

12、通过这种方法，可以根据实际情况动态生成正则表达式，实现更加灵活的字符串处理。

13、最后，介绍如何利用replace方法进行Mustache插值。在模板中，使用{{key}}格式插入数据，通过replace方法替换{{key}}为实际值。具体代码如下：

14、var data={ p1:"replace()", p2:"replacement", p3:"pattern"};

15、"The{{p1}} method returns a new string with some or all matches of a pattern replaced by a{{p2}}. The{{p3}} can be a string or a RegExp, and the{{p2}} can be a string or a function called for each match. If{{p3}} is a string, only the first occurrence will be replaced.".

16、replace(/\{\{\s*(.*?)\s*\}\}/gi, function(str,...args){ return data[args[0]];})

17、通过函数参数接收所有匹配值，并根据data对象中的key值进行替换。这种方法可以处理不确定的插值内容。

18、总结来说，replace方法与正则表达式的结合使用能够大大提高字符串处理的灵活性和效率。

三、JavaScript正则表达式中 : 是什么意思

“?:”是“非获取存储匹配”的意思

“?:”只在一个“()”group中，紧贴着“(”出现，例如“(?:abcdefg)”，不同于“?”，“?:”不是一个量词，但是与“()”共同构造一个元字符，这个元字符所匹配出来的结果，不会保留，也不能参与诸如替换计算等等的操作。（这个操作在服务端多见一些，前端用的不多）（javascript只有string对象的replace方法能用到这个功能）

简单来说，就是你的正则表达式如果用不着在javascript里面使用replace方法，“?:”就可以省去（当然，看个人喜好和排版习惯，还有调试中的页面响应速度，如果加了“?:”反而更快，那就用吧）。

这么说起来还是比较抽象，用实例代码来说明吧。

<p>将匹配的数字增加后缀“9”</p>

var e=document.getElementsByClassName("demo");

var n=str.replace(/(\d+)/gi,"$19");

var n=str.replace(/(?:\d+)/gi,"$19");

可以看到“/(\d+)/gi”所匹配的结果被用于扩展替换字符串中的“$1”；

但是“/(?:\d+)/gi”所匹配的结果没有被用于扩展替换字符串中的“$1”，尽管，它也成功地找到了被查找字符串中的数字，显然结果没有被保留。

对了，类似的问题，可以用这种办法去对比验证。（比如“?=”、“?!”、“?<=”、“?<!”是什么意思……）

上图是在菜鸟教程找到的一个比较全面的正则表达式的元字符列表的部分：

还有，不同软件的正则表达式的可能有不同的特性，但是目前perl的正则表达式是公认最多特性的。