专栏首页码力全开写给前端的正则表达式入门

写给前端的正则表达式入门

1. 概览

JavaScript 中,使用 // 即可创建一个正则表达式对象,当然也可以使用 new RegExp()

常用的跟正则相关的方法有 matchtestreplace。 其中 matchreplace 都是字符串上的方法, test 是正则对象上的方法。

下面看具体的图示:

2. 匹配单字符

  1. /reg/ 可以直接匹配具体的字符串 reg
  2. /[arzy]/ 中的中括号[] 则代表匹配 arzy 中的任意单个字符
  3. /[f-h]/ 中的中杠 - 代表匹配字母表顺序中 fh 中的任意单个字符
  4. /[1-3]/ 则代表匹配数字 1 到 3

3. 正则选项

正则对象的后面也可以跟选项,JavaScript 中常用的选项有:

  1. i - 代表忽略大小写
  2. m - 代表多行匹配
  3. g - 代表全局匹配(可以匹配多次)

4. 边界匹配

  1. ^ - 代表匹配字符串的开头
  2. $ - 代表匹配字符串的结尾

5. 字符匹配

  1. . - 可以匹配除了换行符外的任意字符
  2. \d - 可以匹配任意数字
  3. \D - 可以匹配任意数字
  4. \s - 匹配任意空白字符
  5. \S - 匹配任意空白字符
  6. \n - 匹配换行
  7. \w - 它其实就等同于 [A-Za-z0-9_],即匹配字母数字下划线

6. 量词匹配

  1. * - 匹配 0 次或多次
  2. + - 匹配 1 次或多次
  3. ? - 匹配 0 次或 1 次
  4. {3} - 匹配 3 次
  5. {2,4} - 匹配 2、3 或 4 次
  6. {2,} - 匹配 2 次或多次

7. 分组

() 小括号在正则中代表分组,一般在 match 方法中用来返回全匹配加上多个分组结果,如果使用了 g 选项,则只返回全匹配。

在小括号中你可以使用管道符号 |,它代表

8. 特殊字符

匹配特殊符号的时候需要加反斜杠 \

JS 中的特殊字符有 ^ $ \ . * + ? () [] {} |

所以如果你需要匹配星号 *,就需要这样写:

\*

9. 取非匹配

匹配除了某个字符的任意字符,需要在中括号[] 中使用 ^

至此 ^ 具有两个含义:

  1. 如果用于正则表达式的开头,代表匹配字符串的开头
  2. 如果用于中括号 [] 内部,则代表匹配非此字符

10. 完

上面只是介绍了正则表达式中的基本用法,在日常开发中基本就够用了。更深入的用法比如 贪婪和懒惰零宽断言捕获 ,感兴趣的小伙伴可以自行学习~

正则很强大,但是也不能滥用。如果你写出了一个很复杂的只有你能看懂的正则,更好的做法是不使用正则去实现它~

参考链接

  • Intro to Regex for Web Developers

本文分享自微信公众号 - 码力全开(codingonfire),作者:savokiss

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-11-29

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 浅析 JS 事件循环之 Microtask 和 Macrotask

    我们在上一篇 《浅析 JS 中的EventLoop 事件循环》 中提到一个 Event Queue,其实在事件循环中 queue 一共有两种,还有一种叫 Job...

    savokiss
  • 动图学 JavaScript 之:原型继承

    你是否曾思考为什么我们能使用 JS 中的一些内置属性和方法,比如 .length,.split(),.join()?我们并没有显式地声明它们,那么究竟它们从哪里...

    savokiss
  • 10分钟搭建属于自己的 Vue CLI3 项目模板

    Vue CLI3 出来已经很长时间了,一直想研究它的插件系统却没有时间(其实是懒),刚好最近需要统一一下项目组的规范(借口),于是就有了契机。

    savokiss
  • 正则表达式的回溯[转]

    近期我在为Lazada卖家中心做一个自助注册的项目,其中的shop name校验规则较为复杂,要求: 1. 英文字母大小写 2. 数字 3. 越南文 4. 一些...

    流柯
  • 【Go 语言社区】Golang 转义字符

    \a 匹配响铃符 (相当于 \x07) 注意:正则表达式中不能使用 \b 匹配退格符,因...

    李海彬
  • 正则表达式-基本概念与简单元字符

    首先,正则表达式是一个字符串组成的模式,用来匹配一个字符串,一般用在检索,替换里,也经常用来校验一些字符模式,检验是否匹配一个给定的规则。

    Dylan Liu
  • PHP--正则表达式和样式匹配--小记

    POSIX 风格的,有些低版本软件支持,目前高版本的有些已经废弃不用了,比如 zend studio 的较新版本.

    书童小二
  • 正则表达式符号代表的意义

    无邪Z
  • 正则表达式

    特殊符号(使用需要'\'转义) ! $ ^ * + = | . ? \ / ( ) [ ] { } 创建正则表达式 方法一  var re =new RegEx...

    小古哥
  • 正则表达式总结 原

    [总结] 主要区分match具有g和没有g的区别.然后没有g的时候与exec是等价的. 而exec返回的串类型不受g影响但具有g时候会驱动lastIndex...

    tianyawhl

扫码关注云+社区

领取腾讯云代金券