阅读 156

JavaScript引用类型之正则表达式及应用

正则表达式的用途(目的),百度百科列举如下:

1. 给定的字符串是否符合正则表达式的过滤逻辑(称作“匹配”)。

2. 可以通过正则表达式,从字符串中获取我们想要的特定部分。

在前端开发中,一般用于对表单中的用户输入进行检测,是否匹配一定的规则。

一、正则基础知识

1、常用元字符:

.

匹配除回车符和换行符之外的所有字符

\d

匹配一个数字字符

\D

匹配一个非数字字符

\s

匹配任何空白字符,包括换页符(\f)、换行符(\n)、回车符(\r)、空格、制表符(\t\v)

\S

匹配任何非空白字符

\w

匹配字母、数字、下划线

\W

匹配非字母、数字、下划线

2、边界字符:根据含义不同,放在字符串或分类的前面或后面。

^

以xxx开始,匹配输入字符串开始的位置

$

以xxx结束,匹配输入字符串结尾的位置

\b

匹配单词边界,即字与空格间的位置

\B

匹配非单词边界

特别注意:

var str="hellowhihihi"
var str1="hwuwwuwi"
var reg=/^hello/
str是匹配的,str1是不匹配的,^和$同时使用表示精确匹配
复制代码

3、运算字符:

|

或运算符。x|y表示匹配 x 或 y

4、量词:量词放在在字符或者分类后面运算字符

*

出现零次或多次

出现一次或多次 (记忆:A+表示有A,并且不止A)

出现零次或一次(记忆:条件判断?的有和无,对应1和0)

{n}

出现n次

{n,}

至少出现n次

{n,m}

出现n到m次,最少匹配 n 次且最多匹配 m 次

5、表示分类,指定某类型:[],分类里面比如[3456]就是相当于[3|4|5|6]

[0-9]

匹配一个数字字符

[^0-9]

匹配一个非数字字符

[\t\v\r\n\f]

匹配任何空白字符,包括换页符(\f)、换行符(\n)、回车符(\r)、空格、制表符(\t\v)、

[^\t\v\r\n\f]

匹配任何非空白字符

[a-zA-Z_0-9]

匹配字母、数字、下划线

[^a-zA-Z_0-9]

匹配非字母、数字、下划线

6、表示分组,圈住某个部分作为整体看待:()

7、运算优先级

转义字符(\)>分组()、分类[]>量词>边界字符、常用元字符、任意字符>或元素符(|),遵循从左到右的顺序。

也就是看一个正则表达式,要像看一个算数表达式一样,分组()、分类[]优先看,量词、边界字符、或运算符都是运算符,优先级递减。分组、分类的结果、常用运算符、任意字符都是操作数。

二、常用校验正则表达式

手机号码: /^1[34578][0-9]{9}$/   或

 /^1[34578]\d{9}$/ 。

第二个字符时3或4或5或7或8,

第二个字符之后有9个数字,

字符 ^ 和 $ 同时使用时,表示精确匹配。刚好11个数字,不多不少。

按运算优先级解析大致是这样。

常用正则表达式:

www.cnblogs.com/zxin/archiv…

三、字符串和RegExp正则相关方法

(一)检测给定的字符串是否符合正则表达式的过滤逻辑——不捕获分组的方法

String.prototype.search()

检查字符串是否存在某种正则模式,如果存在,则返回正则表达式在字符串中首次匹配项的索引;否则返回-1。所以用来检测用户输入是否满足规则很合适。

var str = '123ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
var regexp=/[A-E]/gi
str.search(regexp)
输出:3
复制代码

RegExp.prototype.test()

和String.prototype.search()类似,检查检查字符串是否存在某种正则模式。如果存在 ,返回true,否则返回false。这个方法的返回值就是布尔类型更直观些。

var str = '123ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
var regexp=/[A-E]/gi
regexp.test(str)
输出:true
复制代码

(二)从字符串中获取我们想要的特定(符合正则表达式)部分——捕获分组的方法

捕获分组的方法好像用的不太多,我还是先用掌握检测正则的方法有需要再看这些吧。

1、String.prototype.match(),正则不包含/g标志时

developer.mozilla.org/zh-CN/docs/…

2、RegExp.prototype.exec()

developer.mozilla.org/zh-CN/docs/…

(三)根据正则表达式分隔字符

String.prototype.split() 

这个方法不会改变原字符串。指定的分隔符字符串将一个String对象分割成子字符串数组,以一个指定的分割字串来决定每个拆分的位置。分隔符可以是普通字符也可以是正则表达式。

var str='a1b2c3d4';
var regexp1=/\d/;
str.split(regexp1);
输出:["a", "b", "c", "d", ""]
str.split(regexp2)
str.split(regexp1);
输出:["", "1", "2", "3", "4"]
复制代码

(四)替换字符串中正则匹配的部分

String.prototype.replace()

这个方法不会改变原字符串。用法可以很简单也可以很复杂,就先掌握最简单的匹配用法吧。

var str = 'Twas the night before Xmas...';
var newstr = str.replace(/xmas/i, 'Christmas');
console.log(newstr);  // Twas the night before Christmas...
复制代码
文章分类
前端
文章标签