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 相关文章推荐
javascript实现图片切换的幻灯片效果源代码
Dec 12 Javascript
利用浏览器全屏api实现js全屏
Jan 16 Javascript
jquery+html5时钟特效代码分享(可设置闹钟并且语音提醒)
Mar 30 Javascript
D3.js实现直方图的方法详解
Sep 25 Javascript
vue实现ToDoList简单实例
Feb 07 Javascript
JavaScript禁止微信浏览器下拉回弹效果
May 16 Javascript
vue和better-scroll实现列表左右联动效果详解
Apr 29 Javascript
js中offset,client , scroll 三大元素知识点总结
Sep 11 Javascript
VUE.CLI4.0配置多页面入口的实现
Nov 25 Javascript
Threejs实现滴滴官网首页地球动画功能
Jul 13 Javascript
浅谈JS for循环中使用break和continue的区别
Jul 21 Javascript
JS异步宏队列微队列原理详解
Sep 09 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
Discuz 模板语句分析及知识技巧
2009/08/21 PHP
教你如何快捷的使用cmd访问mysql小技巧
2014/05/26 PHP
PHP简单获取及判断提交来源的方法
2016/04/22 PHP
PHP简单判断iPhone、iPad、Android及PC设备的方法
2016/10/11 PHP
Win7环境下Apache连接MySQL提示连接已重置的解决办法
2017/05/09 PHP
PHP写API输出的时用echo的原因详解
2019/04/28 PHP
php反序列化长度变化尾部字符串逃逸(0CTF-2016-piapiapia)
2020/02/15 PHP
腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
2010/07/26 Javascript
用jQuery中的ajax分页实现代码
2011/09/20 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
2012/08/14 Javascript
jqGrid 学习笔记整理——进阶篇(一 )
2016/04/17 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
JavaScript对Json的增删改属性详解
2016/06/02 Javascript
javascript容错处理代码(屏蔽js错误)
2017/01/20 Javascript
jQuery插件echarts实现的单折线图效果示例【附demo源码下载】
2017/03/04 Javascript
socket.io与pm2(cluster)集群搭配的解决方案
2017/06/02 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
2018/02/05 Javascript
Vue一次性简洁明了引入所有公共组件的方法
2018/11/28 Javascript
使用ThinkJs搭建微信中控服务的实现方法
2019/08/08 Javascript
node-red File读取好保存实例讲解
2019/09/11 Javascript
Vue Router中应用中间件的方法
2020/08/06 Javascript
Django自定义认证方式用法示例
2017/06/23 Python
人工智能最火编程语言 Python大战Java!
2017/11/13 Python
Python编程之gui程序实现简单文件浏览器代码
2017/12/08 Python
Python sklearn库实现PCA教程(以鸢尾花分类为例)
2020/02/24 Python
python爬虫开发之PyQuery模块详细使用方法与实例全解
2020/03/09 Python
pycharm2020.1.2永久破解激活教程,实测有效
2020/10/29 Python
Linux开机引导的步骤是什么
2014/02/26 面试题
生产总经理岗位职责
2013/12/19 职场文书
护士的自我鉴定
2014/02/07 职场文书
医学生自我鉴定范文
2014/03/26 职场文书
安全目标责任书
2014/07/22 职场文书
使用Ajax实现进度条的绘制
2022/04/07 Javascript
进阶篇之linux环境下安装MySQL数据库
2022/04/09 MySQL
浅析JavaScript中的变量提升
2022/06/01 Javascript