正则表达式随笔

前端之家收集整理的这篇文章主要介绍了正则表达式随笔前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

正则表达式

一直使用简单的正则表达式,遇到难点的就无法简洁高效的写出正则,故此整理一篇需要记忆应用的正则使用。

正则表达式作用

  • 匹配一个字符串的子字符串(子集),或者替换该字符串。

不得不提的String和reg的常用方法

  • codePointAt(pos) 方法:得到字符的码位。汉字可以得到完整的码位
  • fromCodePoint() 方法:参数提供字符的码位返回对应的字符
  • include() 方法: 如果检测到指定文本就返回true,否则返回false。接受第二个参数为开始搜索的指定索引值
  • startsWith() 方法: 如果在起始位置检测到指定文本就返回true,否则返回false。接受第二个参数为开始搜索的指定索引值
  • endsWith() 方法: 从字符串末尾往前匹配。如果在结束部分检测到指定文本返回true,否则返回false。接受第二个参数为开始搜索的指定索引值
  • repeat()方法 "o".repeat(3) // ooo 表示重复某个字符串指定次数
  • reg.test(str)方法 test()方法执行一个检索,用来查看正则表达式在指定的字符串(str)中是否能被匹配。返回 true 或 false。
  • reg.exec(str)方法 方法在一个指定字符串中执行一个搜索匹配。找到返回一个结果数组或未找到 null。 返回的数组将完全匹配成功的文本作为第一项,将正则括号里匹配成功的作为数组填充到后面

    • 全局调用和非全局调用:全局调用时,在匹配后,它将把RegExp实例的lastIndex属性设置为匹配文本的最后一个字符的下一个位置,当 exec() 再也找不到匹配的文本时,它将返回null,并把lastIndex属性重置为0
  • str.search(reg)方法 执行正则表达式和 String对象之间的一个搜索匹配。如果匹配成功,则 search() 返回正则表达式在字符串中首次匹配项的索引,否则,返回 -1。与上面的reg.test()类似可判断是否存在某个正则模式

    • search() 方法不执行全局匹配,它将忽略标志g,它同时忽略正则表达式对象的lastIndex属性,并且总是从字符串的开始进行检索,这意味着它总是返回字符串的第一个匹配的位置
    • 如果传入一个非正则表达式对象,则会使用 new RegExp(obj) 隐式地将其转换为正则表达式对象。
  • str.match(reg)方法 当一个字符串与一个正则表达式匹配时, match()方法检索匹配项。

    • 参数:如果传入一个非正则表达式对象,则会隐式地使用 new RegExp(obj) 将其转换为一个reg
    • 参数:如果你未提供任何参数,直接使用 match() ,那么你会得到一个包含空字符串的 Array :[""] 。
    • 返回值:如果字符串匹配到了表达式,会返回一个数组,数组的第一项是进行匹配完整的字符串,之后的项是用圆括号捕获的结果。如果没有匹配到,返回null
    • 全局调用:全局匹配返回的数组的内容与非全局大不相同,它的数组元素中存放的是字符串中所有的匹配子串,而且也没有index属性或input属性
    • 非全局调用:只在字符串中匹配依次,若没有匹配到文本,match()返回null,匹配到返回一个数组,数组中第一个元素存放匹配到的文本,其余的元素存放的是与正则表达式的子表达式匹配的文本,数组具有两个属性,index ( 匹配文本的起始字符在字符串位置 )和 input属性
  • String.prototype.replace(reg,function): 是将匹配内容应用函数后返回一个新字符串。
  • String.prototype.split(reg): 以指定的分隔符字符串将一个String对象分割成字符串数组, 如果分隔符是("")则会每个字符都切割。

    • 注意:当字符串为空时,split()返回一个包含一个空字符串的数组,而不是一个空数组,如果字符串和分隔符都是空字符串,则返回一个空数组。
  • Array.prototype.join()方法: join() 方法将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串,不改变原数组。

    • 参数: 指定一个字符串将数组的每一个元素以这个字符串拼接,()为空默认为,("")是引号时则元素之间没有任何字符。这个方法常常和String.prototype.split()连用

一些常用的匹配字符

预定义类

字符集 等价于
. [ ^ rn ] 除了换行和回车符之外所有字符
\d [ 0-9 ]
\D [ ^ 0-9 ]
\s [ tvnr ] 包含制表符、空格、垂直制表符
\S [ ^ tvnr ]
\w [a-zA-Z ]
\W [ ^ a-zA-Z ]

量词

重复修饰符 描述 示例
{n} 指定n 次 /d{5}/数字出现5次
{n,} 最少n次 /d{5,}/数字至少出现5次
{n,m} n值m次
? 最多一次,{0,1}
+ 最少一次
* 任意次

边界字符集

字符 含义
^ 以 xxx开头
$ 以 xxx结尾
\b 单词边界
\B 非单词边界

正则语法

构造方式

  • const re1 = /\d/ 字面量语法 创建
  • const re2 = new RegExp(\d) 构造函数 创建

使用正则搜索

str = "It will rain tomorrow"

//字符串在前
str.startWith("will") //true
str.endsWith("will") //true
str.includes("will") //true

str.match(/\w{3,}/g) // will rain tomorrow
str.search(/\w{3,}/g) // 3

//正则表达式在前

/\w{3,}/g.test(str) //true

....

常用用法

  • 常用修饰符
g:global,全文搜索,不添加的话搜索到第一个结果停止搜索
i:ingore case,忽略大小写,默认大小写敏感
m:multiple lines,多行搜索
  • \D 和 \S \W常用来去除不想要的
  • \D可用来去除不是数字的的字符

    比如: var yourNumber  = 'phoneNumber15555555555'
    var number.replace(/\D/,'')
  • \S 可用来确保必填字段中字符

    var username = '  daixixi '
    var value = /\S/.test(username)
  • 各种修饰符时修饰前一个元素出现的次数

    var a = "hello world2hello china".match(/\w+/)
  • .匹配除了换行和回车符之外字符,可以使用[/\s\S/]匹配所有字符
  • 分组 : 当某一个修饰符对前一个元素进行影响时,若想对一组有作用则使用分组 /(ab)+/ 匹配至少一组连续的ab
  • __或__: 使用竖线表示或,/a|b/ 表示匹配a或b(有个笑话就是这个|写成中文的丨怎么都查不出。。。)
  • 取反 :有限字符集以外的字符 /[^abc]/ 除abc以外字符
  • __范围__: 使用[a-z] 表示a到z 之间任意一个
  • __字符类__:使用[]来构建一个简单的类,/[abc]/ 表示匹配其中任意一个均可
  • 贪婪模式和非贪婪模式: 在设置了量词后匹配是默认是贪婪模式会即以最大的量词进行匹配,不过在量词后面加上?后就可以取最小量词进行匹配,是否匹配结束一般取决于是否加g

    '123456789'.match(/\d{3,5}/g); //["12345","6789"]  
        '123456789'.match(/\d{3,5}?/g); //["123","456","789"]
  • 分组嵌套:

    var str = '<a href="http://a.com">"网址"</a>'
    var reg = /href="((https?:)?\/\/.+?)"/
    console.log(str.match(reg))
    
    var url = str.match(reg)[1]
  • 前瞻:
表达式 含义
exp1(?=exp2) 匹配后面是exp2的exp1
exp1(?!exp2) <span class="Apple-tab-span" style="white-space:pre"></span>匹配后面不是exp2的exp1

得到是exp1的值,不过需要满足条件才会被匹配中

猜你在找的正则表达式相关文章