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 相关文章推荐
IE JS编程需注意的内存释放问题
Jun 23 Javascript
JS 无限级 Select效果实现代码(json格式)
Aug 30 Javascript
基于JQuery实现鼠标点击文本框显示隐藏提示文本
Feb 23 Javascript
js取值中form.all和不加all的区别介绍
Jan 20 Javascript
js实现文本框宽度自适应文本宽度的方法
Aug 13 Javascript
Bootstrap每天必学之媒体对象
Nov 30 Javascript
Bootstrap每天必学之按钮(Button)插件
Apr 25 Javascript
noty ? jQuery通知插件全面解析
May 18 Javascript
利用css+原生js制作简单的钟表
Apr 07 Javascript
解决vue中使用swiper插件问题及swiper在vue中的用法
Apr 04 Javascript
微信小程序自定义组件传值 页面和组件相互传数据操作示例
May 05 Javascript
ant design charts 获取后端接口数据展示
May 25 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和js交互一例-PHP教程,PHP应用
2007/01/03 PHP
PHP 如何利用phpexcel导入数据库
2013/08/24 PHP
PHP封装的MSSql操作类完整实例
2016/05/26 PHP
Laravel框架处理用户的请求操作详解
2019/12/20 PHP
jQuery JSON的解析方式分享
2011/04/05 Javascript
js 窗口抖动示例
2013/09/04 Javascript
JavaScript判断密码强度(自写代码)
2013/09/06 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
2014/04/02 Javascript
在JavaScript中重写jQuery对象的方法实例教程
2014/08/25 Javascript
容易造成JavaScript内存泄露几个方面
2014/09/04 Javascript
jquery validate表单验证的基本用法入门
2016/01/18 Javascript
微信小程序实现给循环列表添加点击样式实例
2017/04/26 Javascript
微信小程序 按钮滑动的实现方法
2017/09/27 Javascript
微信小程序 页面滑动事件的实例详解
2017/10/12 Javascript
如何手动实现es5中的bind方法详解
2018/12/07 Javascript
小程序日历控件使用方法详解
2018/12/29 Javascript
使用nodejs实现JSON文件自动转Excel的工具(推荐)
2020/06/24 NodeJs
vue动态设置页面title的方法实例
2020/08/23 Javascript
[05:24]TI9采访——教练
2019/08/24 DOTA
Python读取Excel的方法实例分析
2015/07/11 Python
在Django框架中设置语言偏好的教程
2015/07/27 Python
numpy库与pandas库axis=0,axis= 1轴的用法详解
2019/05/27 Python
Python如何访问字符串中的值
2020/02/09 Python
python归并排序算法过程实例讲解
2020/11/04 Python
布局和排版教程 纯css3实现图片三角形排列
2014/10/17 HTML / CSS
CAT鞋英国官网:坚固耐用的靴子和鞋
2016/10/21 全球购物
德国亚马逊官方网站:Amazon.de
2020/11/15 全球购物
Oracle的内存结构(Memory structures)
2015/06/10 面试题
银行实习生的自我评价
2014/01/13 职场文书
西式结婚主持词
2014/03/14 职场文书
铁人观后感
2015/06/16 职场文书
初中语文教学随笔
2015/08/15 职场文书
2016母亲节感恩话语
2015/12/09 职场文书
Python list去重且保持原顺序不变的方法
2021/04/03 Python
在HTML中引入CSS的几种方式介绍
2021/12/06 HTML / CSS
Vue中使用import进行路由懒加载的原理分析
2022/04/01 Vue.js