摘要：写在前面正在看的源码看到了部分感觉以前看的正则表达式基础知识已经完全不够用了现翻阅博客资料将一些中正则表达式难用的部分总结归纳方便自己和友翻阅正则分组重复匹配对于重复的匹配我们经常使用到正则表达式的分组功能我们使用正则匹配地址来实践一下假
[TOC]
写在前面 - Lionad正在看VueJS的源码, 看到了HtmlParser部分, 感觉以前看的正则表达式基础知识已经完全不够用了, 现翻阅博客资料, 将一些JS中正则表达式难用的部分总结归纳, 方便自己和sf友翻阅.
正则分组 重复匹配对于重复的匹配, 我们经常使用到正则表达式的分组功能, 我们使用正则匹配IP地址来实践一下.
假设我们要匹配的IP地址在区间 0.0.0.0 - 255.255.255.255 之间, 可以直观的了解到, 我们只需要匹配 三位数字+点号 三遍, 再匹配三位数字一遍就可以了.
这里说的 三位数字+点号 既是我们说的一种规则, 我们可以在表达式中将它们转化为规则即: d{1,3}., 当我们把规则用括号包装后, 就变成了组: (d{1,3}.), 所以匹配IP地址的正则表达式可以写作: (d{1,3}.){3}d{1,3}
换种思路, 我们也可以这样匹配: d{1,3}(.d{1,3}){3}
拓展: 聪明的你可能已经想到, d{1,3} 匹配是有疏漏的. 在实际生产过程中, d{1,3} 可能匹配 999 这种数字, 他是一个错误的IP地址段. 这里贴上真实的IP地址正则匹配供大家参考: ((25[0-5]|2[0-4]d|((1d{2})|([1-9]?d))).){3}(25[0-5]|2[0-4]d|((1d{2})|([1-9]?d))) , 另人愉快的是, 它使用的分组策略仍然是不变的.
后向引用(反向引用)
我们考虑一个很特殊的情况, 当我们要匹配四个IP段相同的情况, 如 100.100.100.100 时, 重复匹配分组的策略失效了: 重复匹配分组 并不能保证匹配相同的数字 -> 这时候我们需要借助 后向引用 策略的力量了(少年, 你渴望力量吗2333, 戳我头像, 带你探索音乐与代码交织的文艺道路.)
后向引用在不同语言的正则表达式书写中, 有不同的语法, 我们讨论JS中最常见的一种, 形如: umber 的后向引用, 其中, number 代表分组的序号.
给你一个简单的栗子, 瞬间就记住了, 假使我们要匹配重复的三位数字, 我们将匹配一个数字的规则标记为一个分组: (d), 重复匹配这个分组(第一个分组)的具体内容三次: (d)1, 这样就达到了目的.
我们很容易将重复匹配和后向引用分别开来: 前者是重复匹配相同的规则, 后者是匹配分组的具体内容.
默认的一些规则需要稍加理解并记住:
代表的是, 整个正则表达式的匹配的内容
捕获分组与不捕获分组当我们用括号包装一个规则, 即造了一个分组, 这个分组是默认被捕获的, 也就是说, 我们能利用后向引用等手段( umber)去调用这个分组.
但是如果我们不想保存这个分组的结果到索引中, 便可以使用形如(?:)的不捕获分组, 表示不需要暂存此分组.
正则断言还记得我看过的一篇大概名为<30分钟学会正则表达式>的文章中, 里面提及过正则断言.
当时感觉真是一看就懂. 但很遗憾, 实际生产中, 使用各种复杂正则表达式的情况实在是太少, 今天如果不翻阅百度, 我恐怕是不能记起断言的分类和各种使用方法了.
断言的字面意思便是, 断定(程序)运行到此时(结果)是这样的"场景", 它描述的是一种 场景, 换句话说, 是一种"肯定的场景". 但要记住的是, 我们的"结果"是不包含在"场景"里面的.
VueJS里头需要匹配HTML tag, 我们就以匹配: "
我们如果使用普通的正则表达式, 如 /
一鼓作气, 我们继续往下
先行断言先行断言, 我是这样理解的: 先匹配内容, 再做"场景"假设.
放到我们先前的栗子中, 便这样匹配, 一直匹配内容, 直到碰上 "" 的场景, 语法如下: (?=)
后发断言后发断言, 我的理解是: 先匹配场景, 再匹配内容.
放到我们先前的栗子中, 先匹配 "
正则表达式是对字符串内容做匹配, 所以我将"先"和"后"的理解绑定到内容匹配的先后顺序上, 方便理解.
我们将先行断言和后发断言结合起来, 整个表达式如下: (?<=
其实我们刚才做的是肯定的场景, 实际情况中还有"不满足此场景"的使用场景.
比如, 我们刚才使用的表达式: (?<=
那负断言, 也就是不满足场景的断言咯... 语法即把正断言中的等于号换成感叹号:
负先行断言 (?!)
负后发断言 (?
如: ["1999","2099","2199"..."9099"] 中如果我们要匹配除了"1999"以外的所有带有"99"结尾的年份, 我们可以使用表达式: (?
拓展: JS中是不支持后发断言的, 所以嘛... 没什么所以, 因为至少还没碰到过缺少后发断言就解决不了的问题2333后记
网易云 Lionad_Guirotar : 前端新手一枚, 欢迎各位 加油&吐槽. 戳我头像, 带你探索音乐与代码交织的文艺道路.参考文章&相关阅读
JS捕获分组于不捕获分组 https://www.zhihu.com/questio...
JS正则基础 http://blog.sina.com.cn/s/blo...
JS后发断言 https://www.cnblogs.com/pmars...
JS没有后发断言的解决方案 https://segmentfault.com/q/10...
JS分组&断言 https://www.cnblogs.com/iyang...
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/107089.html
本文收集学习过程中使用到的资源。 持续更新中…… 项目地址 https://github.com/abc-club/f... 目录 vue react react-native Weex typescript Taro nodejs 常用库 css js es6 移动端 微信公众号 小程序 webpack GraphQL 性能与监控 高质文章 趋势 动效 数据结构与算法 js core 代码规范...
摘要：前端知识点总结高级持续更新中字符串什么是连续存储多个字符的字符数组相同下标遍历选取不同类型不同不通用所有字符串都无权修改原字符串，总是返回新字符串大小写转换统一转大写统一转小写何时不区分大小写时，都需要先转为一致的大小写，再比较。 前端知识点总结——JS高级（持续更新中） 1.字符串 什么是: 连续存储多个字符的字符数组 相同: 1. 下标 2. .length 3. 遍历 4....
摘要：正则引言正则是一个前端必须掌握的知识。这里上篇先介绍正则的规则，下篇结合一些具体题目，带大家重新学习巩固一下正则，争取面试给自己加分。 正则 showImg(https://segmentfault.com/img/bVbo4hv?w=1800&h=1000); 引言 正则是一个前端必须掌握的知识。但是由于用的少，忘了记，记了忘，导致面试经常坐蜡。这里上篇先介绍正则的规则，下篇结合一些...
摘要：基本内容定义正则描述了一种字符串的匹配的模式可以用来检查一个字符串是否包含某个子串或者是替换某个子串一般用于表单验证数据过滤格式检查数据采集数据隐藏元字符所谓元字符是用来说明匹配类型的比如匹配换行符以外的任意字符匹配数字，字母，下划线，汉字 基本内容 定义 正则描述了一种字符串的匹配的模式 ,可以用来检查一个字符串是否包含某个子串或者是替换某个子串;一般用于表单验证,数据过滤,格式检查...
摘要：综上所述两者是出于不同的目的被创建的，解决的也是不同的问题。检测模型变化的过程称为循环。由指令注册的事件处理函数执行。该回调函数会更新插值表达式所在的属性。模块主要关系脚本加载问题。 AngularJS面试题 1.与jQuery的比较 jQuery js函数库 封装简化dom操作 使用jquery的思想是：我拥有一个DOM元素并且想让它去做某件事。也就是命令式编程思想。 angula...
阅读 2036·2021-11-23 09:51
阅读 2175·2021-09-29 09:34
阅读 3635·2021-09-22 15:50
阅读 3488·2021-09-22 15:23
阅读 2464·2019-08-30 15:55
阅读 670·2019-08-30 15:53
阅读 3029·2019-08-29 17:09
阅读 2587·2019-08-29 13:57
