web前端篇：JavaScript正则表达式_html-js-css

概述目录 JavaScript正则表达式 1.创建正则表达式 1.1方法1：直接量语法 1.2 方法2：创建RegExp对象的语法 1.3 区别： 1.4正则表达式使用 2.正则对象的属性 2.1.属性 2.2.应用 2.3.匹配类型 3方法 3.1 test方法 3.2 exec方法 3.3 search方法 3.4match方法 3.5 replace方法 3.6 split方法 3.7示例： 4

JavaScript正则表达式 1.创建正则表达式 1.1方法1：直接量语法 1.2 方法2：创建RegExp对象的语法 1.3 区别： 1.4正则表达式使用 2.正则对象的属性 @L_301_7@ 2.2.应用 2.3.匹配类型 3方法 3.1 test方法 3.2 exec方法 3.3 search方法 3.4match方法 3.5 replace方法 3.6 split方法 3.7示例： 4.常用正则匹配 JavaScript正则表达式 1.创建正则表达式 1.1方法1：直接量语法语法：var reg = /pattern/attributes 解释：参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。参数 attributes 是一个可选的字符串，包含属性 “g”、”i” 和 “m”，分别用于指定全局匹配、区分大小写的匹配和多行匹配。 1.2 方法2：创建RegExp对象的语法语法：var reg = new RegExp(pattern,attributes) 解释：参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。参数 attributes 是一个可选的字符串，包含属性 “g”、”i” 和 “m”，分别用于指定全局匹配、区分大小写的匹配和多行匹配。 1.3 区别：

1.采用直接量语法新建的正则表达式对象在代码编译时就会生成，是平常开发中常用的方式；

2.采用构造函数生成的正则对象要在代码运行时生成。

1.4正则表达式使用

1.正则对象的方法是指这样使用的： RegExp对象.方法(字符串)

2.字符串对象的方法是这样使用：字符串.方法(RegExp对象)

2.正则对象的属性 2.1.属性

ignoreCase 返回布尔值，表示RegExp 对象是否具有标志 iglobal 返回布尔值，表示RegExp对象是否具有标志gmultiline 返回布尔值，表示RegExp 对象是否具有标志 m。lastIndex 一个整数，标识开始下一次匹配的字符位置source 返回正则表达式的源文本（不包括反斜杠）i 执行对大小写不敏感的匹配g 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。m 执行多行匹配正则表达式作用

2.2.应用 2.2.1 验证用于验证时，通常需要在前后分别加上^和$，以匹配整个待验证字符串； 2.2.2 搜索替换搜索/替换时是否加上此限定则根据搜索的要求而定，此外，也有可能要在前后加上\b而不是^和$ 2.3.匹配类型 2.3.1字符匹配

正则表达式	用途
[…]	查找方括号之间的任何字符
[^…]	查找任何不在方括号之间的字符
[a-z]	查找任何从小写 a 到小写 z 的字符
[A-Z]	查找任何从大写 A 到大写 Z 的字符
[A-z]	查找任何从大写 A 到小写 z 的字符
.	查找单个字符，除了换行和行结束符
\w	查找单词字符，等价于[a-zA-Z0-9]
\W	查找非单词字符，等价于`[^a-zA-Z0-9]`
\s	查找空白字符
\S	查找非空白字符
\d	查找数字，等价于[0-9]
\D	查找非数字字符，等价于`[^0-9]`
\b	匹配单词边界
\r	查找回车符
\t	查找制表符
	查找 NulL 字符	\n
查找换行符	正则表达式

2.3.2重复字符匹配

用途	{n,m}
匹配前一项至少n次，但不能超过m次	{n,}
匹配前一项n次或更多次	{n}
匹配前一项n次	n？
匹配前一项0次或者1次，也就是说前一项是可选的，等价于{0，1}	n+
匹配前一项1次或多次，等价于{1，}	n*
匹配前一项0次或多次，等价于{0，}	n$
匹配任何结尾为 n 的字符串	^n
匹配任何开头为 n 的字符串	?=n
匹配任何其后紧接指定字符串 n 的字符串	?!n
匹配任何其后没有紧接指定字符串 n 的字符串	正则表达式

2.3.3匹配特定数字 ^[1-9]\d*$^-[1-9]\d*$^-?[0-9]\d*$^[1-9]\d*|0$^-[1-9]\d*|0$^[1-9]\d*.\d*|0.\d*[1-9]\d*$^-([1-9]\d*.\d*|0.\d*[1-9]\d*)$^-?([1-9]\d*.\d*|0.\d*[1-9]\d*|0?.0+|0)$^[1-9]\d*.\d*|0.\d*[1-9]\d*|0?.0+|0$^(-([1-9]\d*.\d*|0.\d*[1-9]\d*))|0?.0+|0$

用途
	匹配正整数
	匹配负整数
	匹配整数
	0$匹配非负整数（正整数 + 0）
	匹配非正整数（负整数 + 0）
	匹配正浮点数
	匹配负浮点数
	匹配浮点数
	匹配非负浮点数（正浮点数 + 0）
	匹配非正浮点数（负浮点数 + 0）	正则表达式

2.3.4匹配特定字符串

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>text</Title></head><body>    <script type="text/JavaScript">        var reg = /123/g;        var str = 'hello123hello123';        console.log(reg.test(str));//true        console.log(reg.lastIndex);//8        console.log(reg.test(str));//true        console.log(reg.lastIndex);//16        console.log(reg.test(str));//false        console.log(reg.lastIndex);//0            </script></body></HTML>//使用了g修饰符的正则表达式，表示要记录每一次搜索的位置，接着使用test方法，每次开始搜索的位置都是上一次匹配的后一个位置。

用途	^[A-Za-z]+$
匹配由26个英文字母组成的字符串	^[A-Z]+$
匹配由26个英文字母的大写组成的字符串	^[a-z]+$
匹配由26个英文字母的小写组成的字符串	^[A-Za-z0-9]+$
匹配由数字和26个英文字母组成的字符串	^\w+$
匹配由数字、26个英文字母或者下划线组成的字符串

3方法 3.1 test方法

? 检索字符串中指定的值。返回 true 或 false。检索字符串中指定的值。返回 true 或 false。

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>exec</Title></head><body>    <script type="text/JavaScript">        var str='abc';        var reg1 = /x/;        var reg2 = /a/;        console.log(reg1.exec(str));//null        console.log(reg2.exec(str));//array["a",index: 0,input: "xyz"]    </script></body></HTML>

3.2 exec方法

? 方法用于检索字符串中的正则表达式的匹配。返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>exec</Title></head><body>    <script type="text/JavaScript">        var str='abcdabc';        var reg1 = /(a)b(c)/;        console.log(reg1.exec(str));//["abc","a","c",input: "abcdabc",groups: undefined]    </script></body></HTML>

? 如果正则表达式包含圆括号，则返回的数组会包括多个元素。首先是整个匹配成功的结果，后面是圆括号里匹配成功的结果，如果有多个圆括号，他们的匹配成功的结果都会成为数组元素

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>search</Title></head><body>    <script type="text/JavaScript">        var str='abcdefgh';        console.log(str.search('h'))//7    </script></body></HTML>

3.3 search方法

? search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。

? 返回值： stringObject 中第一个与 regexp 相匹配的子串的起始位置。

? 注释：如果没有找到任何匹配的子串，则返回 -1。

? search() 方法不执行全局匹配，它将忽略标志 g。它同时忽略 regexp 的 lastIndex 属性，并且总是从字符串的开始进行检索，这意味着它总是返回 stringObject 的第一个匹配的位置。

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>match</Title></head><body>    <script type="text/JavaScript">        var str = "abcd";        var reg1 = /a/;        var reg2 = /x/;        console.log(str.match(reg1));//a        console.log(str.match(reg2));//null        var str2 = "abcabc";        var reg3 = /a/g;        console.log(str2.match(reg3));//['a','a']    </script></body></HTML>

3.4match方法

? match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。该方法类似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。

? 字符串对象的match方法与正则对象的exec方法比较类似：但是如果正则表达式带有g修饰符，那么match方法与exec方法就有差别了:可以看到match返回了所有成功匹配的结果，但是exec方法只返回了一个。

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>replace</Title></head><body>    <script type="text/JavaScript">        var str = "aaa";        console.log(str.replace('a','f'));//fbcdaa    </script></body></HTML>

3.5 replace方法

? replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

返回值：一个新的字符串，是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。

? 字符串 stringObject 的 replace() 方法执行的是查找并替换的 *** 作。它将在 stringObject 中查找与 regexp 相匹配的子字符串，然后用 replacement 来替换这些子串。如果 regexp 具有全局标志 g，那么 replace() 方法将替换所有匹配的子串。否则，它只替换第一个匹配子串。

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>split</Title></head><body>    <script type="text/JavaScript">        var str = "a,b,c,d,e,f";        var res = str.split(",");//以逗号来分割字符串        console.log(res);//["a","b","d","e","f"]        var str2 =  "a,d";        var res2 = str2.split(/,*/);//以0或对个逗号空格来分割字符串        console.log(res2);//["a","b ","d"]    </script></body></HTML>

3.6 split方法

? split(‘字符串的分割正则‘,‘返回数组的最大成员数‘)；返回分割后各部分组成的数组

<!DOCTYPE HTML><HTML lang="en"><head>    <Meta charset="UTF-8">    <Title>split</Title></head><body>    <script type="text/JavaScript">          var url = "http://www.abc.com";          var reg = /[^.]+/;//匹配除了.之外的其他字符          var res = reg.exec(url)[0].substr(7);          console.log(reg.exec(url));//["http://www",input: "http://www.abc.com"]          console.log(res);//www    </script></body></HTML>

3.7示例：从URL中提取子域名

匹配国内电话号码：\d{3}-\d{8}|\d{4}-\d{7}如 0511-4405222 或 021-87888822匹配QQ号：[1-9][0-9]{4,}从10000开始邮政编码：[1-9]\d{5}(?!\d)邮政编码为6位数字匹配身份z：/^(\d{14}|\d{17})(\d|[xX])$/匹配规则：身份z号码有15位或者18位，其中最后一位可能是X，其他全是数字匹配ip地址：\d+.\d+.\d+.\d+匹配帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$ 表单验证时很实用匹配中文字符： /[\u4E00-\u9FA5\uf900-\ufa2d]/使用 Unicode，必须使用\u开头，接着是字符编码的四位16进制表现形式匹配Email地址：/^([a-zA-Z_0-9-])[email protected]([a-zA-Z_0-9-])+(.[a-zA-Z_0-9-])+$/邮箱的规则是: 由3部分组成由1个或者多个字母数字下划线和杠 + @ + 1个或者多个字母数字下划线和杠 + . + 1个或者多个字母数字下划线和杠匹配网址URL：[a-zA-z]+://[^\s]*判断字符串是不是由数字组成: /^\d*$/限制文本框只能输入数字和小数点(二位小数点):/^\d*.?\d{0,2}$/说明：开头有0个或者多个数字，(?表示匹配前一项0次或者多次)中间有0个或者1个小数点，小数点后面有0个或者最多2个数字用户名正则: /^[\u4E00-\u9FA5\uf900-\ufa2d\w]{4,16}$/匹配规则：只能是中文，英文，数字，下划线，4-16个字符匹配中文字符正则：/[\u4E00-\u9FA5\uf900-\ufa2d]/\w是 匹配英文，数字，下划线匹配英文地址:/^[a-zA-Z][.a-zA-Z\s,0-9]*?[a-zA-Z]+/匹配规则：包含点，字母，空格，逗号，数字，但是开头和结尾必须为字母分析：开头必须为字母可以这样写/[a?zA?Z]/结尾必须为字母可以这样写：/[a?zA?Z]+/中间包含点，字母，空格，逗号，数字的正则：/[.a-zA-Z\s,0-9]*?/外面的*号是0个或者多个，后面的问号? 代表可有可无;有就匹配，没有就不匹配;匹配价格:/^\d*(.\d{0,2})?$/匹配规则: 开头有0个或者多个数字，中间可能有一个小数点，后面有可能有0-2位小数单词的首字母大写:/\b(\w)|\s(\w)/g验证日期格式:/^\d{4}[-\/]\d{1,2}[-\/]\d{1,2}$/日期格式有2种 第一种是yyyy-mm-dd 或 yyyy/mm/dd分析:月和天数可以有1位或者2位

4.常用正则匹配

此文源于： https://www.jb51.net/article/97901.htm

总结

以上是内存溢出为你收集整理的web前端篇：JavaScript正则表达式全部内容，希望文章能够帮你解决web前端篇：JavaScript正则表达式所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1071994.html