什么是正则表达式

  • 正则表达式 Regular Expression (构造函数 RegExp)
  • 用于字符串匹配规则
  • 要么匹配字符,要么匹配位置

如何新建正则表达式

  1. 字面量 /[ab]/gim
const reg = /[\w\*\.]{2}/;
console.log(reg.test('**')); //true
  1. 构造函数 new RegExp([ab${c}]\\d,'gim'); 注意:用构造函数内部表示字符串,当使用\w,\d 等特殊转译字符时候,\默认是当作转译字符串来处理的,所以要多加一个\ 再进行转译。 当正则创建要用到变量时候,必须使用构造函数形式创建!
const reg = new RegExp('[\\w\*\.]{2}','gim');

// 在正则中插入变量,只能使用构造函数方式新建
const value = '永远的43';
const reg = new RegExp(`^${value}号$`);
const reg.test('永远的43号'); // true

正则字符

  1. 元字符 ( ) [ ] +|{ }. * ? ^ $

    元字符表示在正则中有特殊意义,如果需要使用到元字符的字符串匹配,需要使用转译字符。

  2. 特殊字符(\w, \W, \d, \D, \s, \S等)

  • \w 单词字符[a-zA-Z_0-9]
  • \W 非单词字符[^a-zA-Z_0-9]
  • \d 数字字符[0-9]
  • \D 非数字字符[^0-9]
  • \s 空格字符(空格,制表符等)
  • \S 非空格字符

一 匹配位置

位置字符:

^ $ \b \B (?=P) (?!p) (?<=p) (?<!p)

  • ^ 表示字符串第一个字符之前位置
  • $表示字符串最后一个字符之后的位置
// 在字符串开头位置添加一个字符¥,末尾加一个.00 字符
const str = '5600';
const money = str.replace(/^/,'¥').replace(/$/,'.00');
console.log(money); // ¥5600.00
  • \b 表示单词字符\w与非单词字符\W之间的位置,也包括\w字符与^和$之间的位置(与\w 一起使用,表示单词边界)

  • \B 表示单词字符之间的位置,非单词字符与^ 和|之间的位置,非单词字符之间的位置(与\w 一起使用,表示单词内部位置)

  • (?=P) 表示 P之前的位置;(?!P)表示除开P之前位置的所有位置

  • (?<=P)表示 P之后的位置;(?<!P)表示除开P之后的位置的所有位置

// 格式化金额,例如 500000 -> 500,000;-500000->-500,000;
// 分析:加的,字符不能在头部,也不能在-后面
// 步骤一
const reg = /(?=(\d{3})+$)/g;
const str = '500000';
const money = str.replace(reg,','); // ,500,000; // 步骤二:处理,不能出现在字符串首部
const reg = /(?!^)(?=(\d{3})+$)/g;
const str = '500000';
const money = str.replace(reg,','); // 500,000;
// 貌似满足要求了,bug -500000测试发现...
const str = '-500000';
const money = str.replace(reg,','); // -,500,000; // 步骤三处理不能在-号后
const reg = /(?!^)(?<!-)(?=(\d{3})+$)/;
const str = '-500000';
const money = str.replace(reg,','); // -500,000;
// okay! 貌似功能确实了,但是 太过复杂了,有没有简单点的方法呢 // 优化: 利用\B,\b
const reg = /\B(?=(\d{3})+\b)/; // 大功告成

二 匹配字符

量词

量词 次数 标准写法
* 大于等于0次 {0,}
+ 大于等于1次 {1,}
? 0次或者1次 {0,1}
5次 精准匹配5次 {5}

贪婪模式 和 惰性模式

  • 贪婪模式:一次匹配尽量匹配量词最多,直到匹配不下,才算一次匹配结束。/g 全局模式,会从上次匹配字符之后继续进行匹配。 默认的量词模式就是贪婪模式。

  • 惰性模式:只匹配量词最少情况,也就是一旦条件满足就结束本轮匹配,/g模式会自动从已经匹配的字符之后开始下一轮匹配。

    如何开启惰性模式,在 量词后面加 ?, 比如 \d[2,4]?

    分支选择模式默认为惰性模式 (a|b|c)当匹配到了分支a,就不会再去匹配分支b或者c

惰性模式有什么用?

例如: /a.*?b/g 匹配以a开头,以b结尾 ,中间内容最少 的字符串

const a = 'abcdacb'
const reg1 = /a.*b/g
const reg2 = /a.*?b/g
console.log(a.match(reg1)); //['abcdacb']
console.log(a.match(reg2)); //['ab', 'acb']

分组匹配()

非捕获括号(?: )

const phone = '18582556244';
const reg = /(\d{3})(\d{4})(\d{4})/;
const formatedphone = phone.replace(reg,(str,$1,$2,$3)=>{
return `${$1}-${$2}-${$3}`
}); // '185-8255-6244'

反向引用

通常在分支模式中,表示后续的匹配与上次匹配上的分支保持一致,使用\1,\2表示从左到右第一个括号匹配的内容

匹配模式 gim

  • g 全局匹配
  • i 忽略大小写
  • m 多行模式

使用正则方式

  1. 正则的方法

    test 验证 字符串是否满足改正则表达式,返回ture/false

  2. 字符串的方法

    replace,根据正则匹配特定的字符串进行替换,第二个参数可以是函数(在括号分组中有用)

match,返回满足正则表达式的数组 (/g模式和非/g模式返回的值不同)

search,搜索返回满足正则表达式的字符串在 原字符串中的起始位置

split,根据正则进行字符串拆分成数组

正则小练习

  1. 用正则实现str.trim()功能
  2. 讲金币转化为 ¥1,223,234.98 格式,截取保留两位小数
  3. 将transform_new_data 转化为小驼峰命名
  4. 验证密码(8到12位,数字,小写字母,大写字母,且至少由两种组合而成 )

正则表达式入门(js版)的更多相关文章

  1. Python 正则表达式入门(中级篇)

    Python 正则表达式入门(中级篇) 初级篇链接:http://www.cnblogs.com/chuxiuhong/p/5885073.html 上一篇我们说在这一篇里,我们会介绍子表达式,向前向 ...

  2. Python 正则表达式入门(初级篇)

    Python 正则表达式入门(初级篇) 本文主要为没有使用正则表达式经验的新手入门所写. 转载请写明出处 引子 首先说 正则表达式是什么? 正则表达式,又称正规表示式.正规表示法.正规表达式.规则表达 ...

  3. Twitter面试题蓄水池蓄水量算法(原创 JS版,以后可能会补上C#的)

    之前在群里有人讨论Twitter的面试题,蓄水池蓄水量计算,于是自己写了个JS版的(PS:主要后台代码还要编译,想想还是JS快,于是就使用了JS了.不过算法主要还是思路嘛,而且JS应该都没问题吧^_^ ...

  4. 【干货】JS版汉字与拼音互转终极方案,附简单的JS拼音输入法

    前言 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的不支持多音字,有的不支持声调,有的字典文件太大,还比如有时候我仅仅是需要获取汉字拼音首字母却要引入200kb的字 ...

  5. 分享录制的正则表达式入门、高阶以及使用 .NET 实现网络爬虫视频教程

    我发布的「正则表达式入门以及高阶教程」,欢迎学习. 课程简介 正则表达式是软件开发必须掌握的一门语言,掌握后才能很好地理解到它的威力: 课程采用概念和实验操作 4/6 分隔,帮助大家理解概念后再使用大 ...

  6. JavaScript正则表达式详解(一)正则表达式入门

    JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...

  7. 团购、定时抢购倒计时js版

     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org ...

  8. JS版百度地图API

    地图的构建非常简单,官方的API文档也写得很清晰,我只做一总结: 一起jquery,17jquery 一.引入JS :这个很容易理解,既然是调用JS版的百度地图,肯定得引用外部的JS文件了,而这个文件 ...

  9. 使用正则表达式匹配JS函数代码

    使用正则表达式匹配JS函数代码 String someFunction="init"; Pattern regex = Pattern.compile("function ...

  10. PureMVC(JS版)源码解析:总结

    PureMVC源码中设计到的11个类已经全部解析完了,回首想想,花了一周的时间做的这点事情还是挺值得的,自己的文字组织表达能力和对pureMVC的理解也在写博客的过程中得到了些提升.我也是第一次写系列 ...

随机推荐

  1. 『与善仁』Appium基础 — 7、ADB Shell命令的使用

    目录 1.查看进程 2.查看实时资源占用情况 3.查看进程 UID 4.其它ADB Shell命令说明 Android系统是基于 Linux 内核的,也就是说Android系统的底层是Linux系统. ...

  2. VMware Workstation 无法连接到虚拟机。请确保您有权运行该程序、访问该程序使用的所有目录以及访问所有临时文件目录。 VMware Authorization Service 当前未运行

    VMware Workstation 无法连接到虚拟机.请确保您有权运行该程序.访问该程序使用的所有目录以及访问所有临时文件目录. VMware Authorization Service 当前未运行 ...

  3. Effective C++ 总结笔记(六)

    七.模板与泛型编程 41.了解隐式接口和编译器多态 1.类和模板都支持接口和多态. 2.类的接口是显式定义的--函数签名.多态是通过虚函数在运行期体现的. 3.模板的接口是隐式的(由模板函数的实现代码 ...

  4. vi/vim 常用命令总结

    目录 Linux vi/vim编辑 vim键盘图 vim的三种模式 命令模式.输入模式.输出模式 vim使用实例 vi/vim按键说明 第一部分:一般模式可用的光标移动.复制粘贴.搜索替换等 第二部分 ...

  5. Spring Boot + MyBatis 多模块项目搭建教程

    一.前言 1.开发工具及系统环境 IDE:IntelliJ IDEA 2020.2.2 系统环境:Windows 2.项目目录结构 biz层:业务逻辑层 dao层:数据持久层 web层:请求处理层 二 ...

  6. [at4631]Jewels

    如果要选某颜色,必然会选该颜色最大的两个,那么不妨将这两个宝石权值修改为两者的平均数,显然不影响两者的和,也即不影响答案 接下来,将所有宝石按权值从大到小排序,并在权值相同时按颜色编号从小到大(使颜色 ...

  7. [cf674E]Bear and Destroying Subtrees

    令$f_{i,j}$表示以$i$为根的子树中,深度小于等于$j$的概率,那么$ans_{i}=\sum_{j=1}^{dep}(f_{i,j}-f_{i,j-1})j$ 大约来估计一下$f_{i,j} ...

  8. [atAGC050F]NAND Tree

    当$n$为偶数,暴力$o(n)$枚举第一次操作,以下只考虑$n$为奇数的情况 此时,$n-1$即操作次数为偶数,找到最小的$i$(其中$1\le i\le \frac{n-1}{2}$),满足第$2i ...

  9. HCNP Routing&Switching之组播技术-组播基础

    组播技术背景 随着internet网络的不断发展,网络中交互的各种数据.语音.视频信息数量突增:新型的在线直播.网络电视.视频会议等应用也在逐渐兴起:这些业务大多符合点到多点的模式,对信息安全性.传播 ...

  10. layui的动态下拉选

    <!--将授权问卷id全部查询出来--> <div class="layui-inline"> <label class="layui-fo ...