JS正则表达式要点分析

本文主要和大家分享js正则表达式的要点,由于之前在看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), 这样就达到了目的.

我们很容易将重复匹配和后向引用分别开来: 前者是重复匹配相同的规则, 后者是匹配分组的具体内容.

默认的一些规则需要稍加理解并记住:

代表的是, 整个正则表达式的匹配的内容

正则断言

还记得我看过的一篇大概名为的文章中, 里面提及过正则断言.
当时感觉真是一看就懂. 但很遗憾, 实际生产中, 使用各种复杂正则表达式的情况实在是太少, 今天如果不翻阅百度, 我恐怕是不能记起断言的分类和各种使用方法了.

断言的字面意思便是, 断定(程序)运行到此时(结果)是这样的”场景”, 它描述的是一种 场景, 换句话说, 是一种”肯定的场景”. 但要记住的是, 我们的”结果”是不包含在”场景”里面的.

VueJS里头需要匹配HTML tag, 我们就以匹配: ‘Not Fault’ 中的 ‘Not Fault’ 为例吧.

我们如果使用普通的正则表达式, 如 /.*/ 会匹配到整个字符串 ‘Not Fault’. 我们使用断言, 以”场景”的方式思考: ” 和 ” 是一种”肯定的场景”, 我们需要匹配的结果是: ‘Not Fault’, 无论tag内部的字符无论如何变化, tag头和tag尾都是不变的.

一鼓作气, 我们继续往下

先行断言

先行断言, 我是这样理解的: 先匹配内容, 再做”场景”假设.

放到我们先前的栗子中, 便这样匹配, 一直匹配内容, 直到碰上 ” 的场景, 语法如下: (?=)

后发断言

后发断言, 我的理解是: 先匹配场景, 再匹配内容.

放到我们先前的栗子中, 先匹配 ” 的场景, 再继续往下匹配内容, 语法如下: (?)

实践

正则表达式是对字符串内容做匹配, 所以我将”先”和”后”的理解绑定到内容匹配的先后顺序上, 方便理解.

我们将先行断言和后发断言结合起来, 整个表达式如下: (?).*(?=), 我们便可获得想要的结果: ‘Not Fault’ 了.

“正负”断言

其实我们刚才做的是肯定的场景, 实际情况中还有”不满足此场景”的使用场景.

比如, 我们刚才使用的表达式: (?).*(?=) 是肯定有 ” ” 的场景下去匹配内容, 其实是使用的 “正后发断言” 和 “正先行断言”, “正”即代表肯定的状态.

那负断言, 也就是不满足场景的断言咯… 语法即把正断言中的等于号换成感叹号:

负先行断言 (?!)

负后发断言 (?

如: [‘1999′,’2099′,’2199’…’9099’] 中如果我们要匹配除了’1999’以外的所有带有’99’结尾的年份, 我们可以使用表达式: (?

相关推荐:

JavaScript正则表达式常用基本语法

猪哥深谈php正则表达式及正则表达式都用在什么地方?

JS基于正则表达式实现的密码强度验证功能示例_javascript技巧

以上就是JS正则表达式要点分析的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2788211.html

(0)
上一篇 2025年3月8日 18:23:19
下一篇 2025年3月8日 18:23:25

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • javascript常用工具类的封装详解

    因为工作中经常用到这些方法,所有便把这些方法进行了总结。本文主要给大家详细分析了javascript常用工具类的封装相关知识点,有兴趣的朋友参考下吧,希望能帮助到大家。 JavaScript 1. type 类型判断 isString (o…

    编程技术 2025年3月8日
    200
  • JavaScript读取和写入cookie实例教程

    本文主要给大家通过实例讲述了javascript读取和写入cookie的相关知识点,有这方面需要的朋友参考下吧,希望能帮助到大家。 首先先让我们简单地了解一下cookie. 在我们制作网页的过程中,经常需要把信息从一个页面传递给另一个页面,…

    2025年3月8日 编程技术
    200
  • JS中Object对象的原型基本概念

    本文是一篇关于js学习的基础内容,学习object对象的原型概念,有兴趣的朋友参考下吧。希望能帮助到大家。 对象概念 在 javascript 中, 一切引用类型均为对象。 如 function Foo () {} 中,Foo本身就是一个对…

    2025年3月8日
    200
  • javascript trie前缀树代码详解

    本文主要介javascript trie单词查找树的示例,详细的介绍了trie的概念和实现,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能帮助到大家。 引子 Trie树(来自单词retrieval),又称前缀字,单词查找树,字典树…

    2025年3月8日
    200
  • Node.js非对称加密方法的实现

    在node.js中,负责安全的模块是crypto。本文主要给大家分享了node.js非对称加密方法以及代码实例讲解,对此有兴趣的朋友参考学习下吧,希望能帮助到大家。 加密、解密方法 在Node.js中,负责安全的模块是crypto。非对称加…

    编程技术 2025年3月8日
    200
  • JavaScript实现新浪微博输入字数即时检查功能

    本文主要和大家介绍javascript实现的仿新浪微博原生态输入字数即时检查功能,涉及javascript事件响应及字符串的遍历、转换、判断等相关操作技巧,需要的朋友可以参考下,希望能帮助到大家。 边在文本框输入字符边对输入的字数进行检查本…

    2025年3月8日
    200
  • 离开页面前提示功能的js代码

    本文主要介绍javascript实现离开页面前提示功能,结合具体实例形式分析了javascript实现针对关闭页面的事件响应原理与操作技巧,并附带jquery的相应实现方法,需要的朋友可以参考下,希望能帮助到大家。 离开页面前的提示不可以用…

    2025年3月8日
    200
  • js数组和对象的深浅拷贝详解

    本文主要为大家详细介绍js实现数组和对象的深浅拷贝,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望梦帮助到大家。 前提:原始数据类型和对象类型赋值时的差异 JavaScript的数据类型分为原始数据类型和对象类型。二者在内存中存放的…

    编程技术 2025年3月8日
    200
  • JavaScript前端数据多条件筛选功能实现代码

    有时候也会需要在前端进行数据筛选,增强交互体验。当数据可用的筛选条件较多时,把逻辑写死会给后期维护带来很*烦。下面是我自己写的一个简单的筛选器,筛选条件可以根据数据包含的字段动态设置。本文主要为大家详细介绍了基于javascript实现前端…

    2025年3月8日
    200
  • JavaScript中重名的函数与对象解析

    在js中如果函数与对象重名了会怎么样?仔细详细这个问题值得讨论一下,本文主要给大家介绍了关于javascript中重名的函数与对象的相关资料,需要的朋友可以参考借鉴,下面来一起看看吧啊,希望能帮助到大家。 JavaScript 允许重复声明…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论