JavaScript RegExp 对象用法详解


Posted in Javascript onSeptember 24, 2019

当您检索某个文本时,可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。

简单的模式可以是一个单独的字符。

更复杂的模式包括了更多的字符,并可用于解析、格式检查、替换等等。

您可以规定字符串中的检索位置,以及要检索的字符类型,等等。

1.基本用法

<script>
  // 创建正则
  var reg = /hello/
  // 检测某个字符串是否有符合正则格式的文本
  var flag = reg.test("hello world")
  console.log(flag) // true
</script>

2.修饰符

修饰符用于执行区分大小写和全局匹配

i 不区分大小写

g 全局匹配

<script>
  // 默认会区分大小写
  var reg = /hello/
  var flag = reg.test("Hello World")
  console.log(flag) // false
  // 添加i修饰符 不区分大小写
  var reg2 = /hello/i
  var flag2 = reg2.test("Hello World")
  console.log(flag2) // true

  var str = "I'm in a bad mood, really bad"
  // 默认非全局匹配
  var reg3 = /bad/
  var newStr = str.replace(reg3,"good")
  // 只替换了一个bad
  console.log(newStr) // I'm in a good mood, really bad
  // 全局匹配
  var reg4 = /bad/g
  var newStr2 = str.replace(reg4,"good")
  // 替换了全局的bad为good
  console.log(newStr2) // I'm in a good mood, really good

  // 同时使用
  var reg5 = /bad/gi
</script>

3.元字符

元字符是拥有特殊含义的字符:

. 查找单个字符,除了换行和行结束符。(通俗的说是任意字符)

  • \d 匹配数字0-9
  • \D 匹配非数字
  • \s 匹配任意空白字符(不局限空格)
  • \S 匹配非空白字符
  • \w 元字符用于查找单词字符。(单词字符包括:a-z、A-Z、0-9,以及下划线)
  • \W 元字符用于查找非单词字符。

4.方括号

方括号用于查找某个范围内的字符

  • [abc] 匹配中括号中存在的一个字符(a,b,c中的一个)
  • [^abc] 匹配中括号中不存在的一个字符(除a,b,c中以外的字符)
  • [0-9] 查找任何从 0 至 9 的数字。
  • [a-z] 查找任何从小写 a 到小写 z 的字符。
  • [A-Z] 查找任何从大写 A 到大写 Z 的字符。
  • [A-z] 查找任何从大写 A 到小写 z 的字符。

5.量词

  • \d{6} 匹配6个数字
  • \d{4,6} 匹配4到6个数字
  • \d{4,} 匹配至少4个数字
  • ? 0或1 超出1个不匹配
  • + 至少1个
  • * 0个或多个

.*会尽可能的匹配更长的字符(贪婪)

.*?会尽可能的匹配更短的字符(禁止贪婪)

\d{4,6} 会尽可能的匹配更长的字符(贪婪)

\d{4,6}? 会尽可能的匹配更短的字符(禁止贪婪)

6.边界匹配

^n 匹配任何开头为 n 的字符串。

n$ 匹配任何结尾为 n 的字符串。

7.实例

匹配手机号

var reg = /^1\d{10}$/;

匹配QQ号

var reg = /^[1-9]\d{4,10}$/;

匹配身份证号

var reg = /^[1-9]\d{16}[Xx\d]$/;

变量名检测(只能由字母,数字,下划线组成,且不能以数字开头,长度6-15)

var reg = /^[A-z_]\w{5,14}$/;

8.相关方法

test():检测正则表达式是否能在指定字符串中查找到匹配的文本

<script>
  var str = "hi66morning77"
  // 匹配连续的3个数字
  var reg = /\d{3}/
  console.log(reg.test(str)) // false
  // 匹配连续的7个小写字母
  var reg2 = /[a-z]{7}/
  console.log(reg2.test(str)) // true
</script>

match():查找字符串,将符合正则表达式规则的文本以数组形式返回,如果没有指定全局匹配,则只查找一次。找不到就返回null

<script>
  var str = "hi66morning77"
  // 匹配连续的2个数字 非全局匹配
  var reg = /\d{2}/
  console.log(str.match(reg)[0]) // 66
  // 匹配连续的2个数字 全局匹配(推荐)
  var reg2 = /\d{2}/g
  console.log(str.match(reg2)) // ["66", "77"]  
</script>

search():返回目标自字符串第一次出现的索引值(所以全局匹配被忽略)

<script>
  var str = "hi66morning77"
  // 匹配连续的2个数字 非全局匹配
  var reg = /\d{2}/
  console.log(str.search(reg)) // 2
  // 匹配a,b,m中的一个
  var reg2 = /[abm]/
  console.log(str.search(reg2))  // 4   
</script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
Jan 13 Javascript
无刷新预览所选择的图片示例代码
Apr 02 Javascript
node.js实现逐行读取文件内容的代码
Jun 27 Javascript
JavaScript DOM节点添加示例
Jul 16 Javascript
JavaScript实现删除,移动和复制文件的方法
Aug 05 Javascript
BootStrap的table表头固定tbody滚动的实例代码
Aug 24 Javascript
利用jquery实现下拉框的禁用与启用
Dec 07 Javascript
详解bootstrap的modal-remote两种加载方式【强化】
Jan 27 Javascript
vue.js父组件使用外部对象的方法示例
Apr 25 Javascript
electron + vue项目实现打印小票功能及实现代码
Nov 25 Javascript
Vue SSR 即时编译技术的实现
May 06 Javascript
vue集成openlayers加载geojson并实现点击弹窗教程
Sep 24 Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
Sep 24 #Javascript
解决layui table表单提示数据接口请求异常的问题
Sep 24 #Javascript
关于layui时间回显问题的解决方法
Sep 24 #Javascript
Vue之Mixins(混入)的使用方法
Sep 24 #Javascript
JavaScript Array对象使用方法解析
Sep 24 #Javascript
详解简单易懂的 ES6 Iterators 指南和示例
Sep 24 #Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
Sep 24 #Javascript
You might like
php获取地址栏信息的代码
2008/10/08 PHP
浅析PHP substr,mb_substr以及mb_strcut的区别和用法
2013/06/21 PHP
关于ob_get_contents(),ob_end_clean(),ob_start(),的具体用法详解
2013/06/24 PHP
php实现分页显示
2015/11/03 PHP
PHP 记录访客的浏览信息方法
2018/01/29 PHP
PHP使用观察者模式处理异常信息的方法详解
2019/09/24 PHP
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
2012/10/12 Javascript
js判断undefined变量类型使用typeof
2013/06/03 Javascript
JS对select控件option选项的增删改查示例代码
2013/10/21 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
举例说明JavaScript中的实例对象与原型对象
2016/03/11 Javascript
完美解决浏览器跨域的几种方法(汇总)
2017/05/08 Javascript
jQuery插件开发发送短信倒计时功能代码
2017/05/09 jQuery
JavaScript实现的联动菜单特效示例
2019/07/08 Javascript
js之切换全屏和退出全屏实现代码实例
2019/09/09 Javascript
node.js中 mysql 增删改查操作及async,await处理实例分析
2020/02/11 Javascript
原生JS实现烟花效果
2020/03/10 Javascript
文章或博客自动生成章节目录索引(支持三级)的实现代码
2020/05/10 Javascript
Python通过OpenCV的findContours获取轮廓并切割实例
2018/01/05 Python
python多维数组切片方法
2018/04/13 Python
django 将model转换为字典的方法示例
2018/10/16 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
关于pycharm中pip版本10.0无法使用的解决办法
2019/10/10 Python
python 引用传递和值传递详解(实参,形参)
2020/06/05 Python
草莓网化妆品日本站:Strawberrynet日本
2017/10/20 全球购物
澳大利亚家具和家居用品在线商店:Interiors Online
2018/03/05 全球购物
英国和爱尔兰的自炊式豪华度假小屋:Rural Retreats
2018/06/08 全球购物
汇科协同Java笔试题
2012/03/31 面试题
国外的一些J2EE面试题一
2012/10/13 面试题
css animation配合SVG制作能量流动效果
2021/03/24 HTML / CSS
高级人员简历的自我评价分享
2013/11/03 职场文书
安全生产汇报材料
2014/02/17 职场文书
2015年党总支工作总结
2015/05/25 职场文书
MySQL表的增删改查基础教程
2021/04/07 MySQL
简单聊聊TypeScript只读修饰符
2022/04/06 Javascript
Python中Schedule模块使用详解 周期任务神器
2022/04/19 Python