美文网首页技术干货
JS正则基础整理

JS正则基础整理

作者: 我是那只喵 | 来源:发表于2017-10-07 11:51 被阅读0次

    Regular Expression 正则表达式是指:

    使用单个字符串来描述或者匹配一系列符合某个句法规则的字符串。

    在JS中正则有两种表达方式:

    1. 字面量 var reg = /\b$/g

    2. 构造函数 var reg = new RegExp('\\b$','g')

    上面字面量或者构造函数中包含的g为正则表达式中的修饰符,修饰符包括:

    1. g:global代表全文搜索,不添加,则匹配到第一个之后就停止

    2. i:ignore case代表忽略大小写,默认对大小写敏感

    3. m:multiple lines代表多行搜索

    接下来介绍正则中比较特殊的字符:

    \t 水平制表符

    \v 垂直制表符

    \n 换行符

    \r 回车符

    \0 空字符

    \f 换页符

    \cX 与X对应的控制字符 e.g. Ctrl+X

    接下来我们来看正则表达式怎么书写,一般情况下

    正则表达式的一个字符对应字符串中的一个字符

    abc\t 

    表示字符abc再加上一个水平制表符

    abc\t

    [abc]\t

    []代表类,类表示泛指,所以表达式表示abc中任意一个,再加一个水平制表符

    [abc]\t

    [^abc]\t

    对于类,我们是可以通过^取反的,所以表达式表示不是abc中任意一个,再加一个水平制表符

    [^abc]\t

    [a-z]

    如果我们要创建一个24个小写字母的类,依据上面的方法,我们可以把24个字母都写到[]中,但这样很冗杂,所以就有了范围类,所以表达式表示a到z中任意一个小写字母,包含a和z

    [a-z]

    有一些常用的类被预先定义了,称为预定义类,用起来比较方便

    字符 | 等价类 | 含义

    .  [^\n\r] 除了回车和换行符以外的所有字符

    \d  [0-9] 数字字符

    \D  [^0-9] 非数字字符

    \s  [\t\n\x0B\f\r] 空白符

    \S  [^\t\n\x0B\f\r] 非空白符

    \w  [a-zA-Z_0-9] 单词字符,包括:字母、数字、下划线

    \W  [^a-zA-Z_0-9] 非单词字符

    [abc]\d

    表示匹配abc中任意一个,再加一个数字

    [abc]\d

    上面的举例都是一个字符一个字符的匹配,万一需要匹配的字符串很长,比如说需要连续出现10个数字字符,那我们应该怎样去写比较方便呢?

    \d{10}

    表示数字出现10次

    \d{10}

    像这样的量词,正则中有如下规定:

    字符 | 含义

    ?  出现一次或没有,最多一次

    +  出现一次或更多,至少一次

    *  没有或出现多次,出现任意次

    {n}  出现n次

    {n,m}  出现n到m次

    {n,}  至少出现n次

    abc\b

    表示abc后面匹配一个位置,这个位置为单词边界,所谓单词边界指:一个位置,这个位置的一侧是构成单词的字符,另一侧为非单词字符、字符串的开始或结束位置。“\b”是零宽度的。

    abc\b

    正则还提供了一些边界匹配字符

    字符 | 含义

    ^  以xxx开始

    $  以xxx结尾

    \b  单词边界

    \B  非单词边界

    学会了书写,接下来我们来看匹配,匹配有贪婪模式匹配,和非贪婪模式匹配,非贪婪模式指让正则表达式尽可能的少匹配,一旦匹配成功就不再继续尝试匹配,而贪婪模式刚好相反

    要实现非贪婪模式匹配,就在两次后面加上?就可以了

    非贪婪模式和贪婪模式

    abc{3}

    abc{3}

    (abc){3}

    (abc){3}

    使用()可以进行分组

    wendy(S|Q)

    wendy(S|Q)

    可以使用|代表或者的意思

    JS中用的比较多的方法在这儿列举一下:

    reg.test('123') 如果符合规则返回true,否则返回false

    '123'.match(/\d{1,2}/g) 返回匹配到的结果,若有则为数组,否则为null

    '2017-10-07'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2'+'-'+'$3'+'-'+'$1')

    replace方法

    若是不想捕获某一个分组,可以在分组加上?: 即可

    replace不捕获某一分组

    最后,推荐一个正则表达式的分析工具https://regexper.com/#wendy(S%7CQ)

    相关文章

      网友评论

        本文标题:JS正则基础整理

        本文链接:https://www.haomeiwen.com/subject/dqoiextx.html