【JavaScript】正则表达式主要知识点总结

    • 1、概述
      • 1.1 什么是正则表达式?
      • 1.2 正则表达式的特点
    • 2、在JS中的使用
      • 2.1 创建正则表达式
      • 2.2 测试test()正则表达式是否书写规范
      • 2.2 正则表达式的组成
        • 2.2.1 边界符
        • 2.2.2 字符类
        • 2.2.3 量词符
        • 2.2.4 括号总结(正则验证网站)
      • 2.3 正则表达式的特殊字符
        • 2.3.1 预定义类
      • 2.4 正则表达式中的替换
        • 2.4.1 replace()
        • 2.4.2 正则表达式的参数

1、概述

1.1 什么是正则表达式?

  • 正则表达式( Regular Expression )是用于匹配字符串中字符组合的模式
  • 在JavaScript中,正则表达式也是对象
  • 应用场景:表单验证匹配、过滤页面敏感词进行替换提取字符串特定部分(搜索框生成相关关键字)

1.2 正则表达式的特点

  • 灵活性、逻辑性和功能性非常强
  • 迅速地用极简单的方式达到字符串的复杂控制
  • 刚接触不易理解
  • 实际开发,一般直接复制写好的正则表达式,但要求能根据实际情况修改正则表达式

2、在JS中的使用

2.1 创建正则表达式

  1. 通过调用RegExp对象的构造函数创建
var 变量名 = new RegExp(/表达式/)
  1. 通过字面量创建(*常用)
var 变量名 = /表达式/

2.2 测试test()正则表达式是否书写规范

test():用于检测字符串是否符合该规则,该对象会返回true或false ,其参数是测试字符串

regexObj.test(str)
  • regexObj:书写的正则表达式
  • str:测试的文本
  • 实例:
var rg = /123/ //只要包含abc即可
console.log(rg.test('123')); //true 
console.log(rg.test('abc')); //false

2.2 正则表达式的组成

  • 简单字符 /abc/
  • 简单+特殊字符 /ab*c/
  • 特殊字符也被称为元字符,具有特殊意义的专用符号,如^、$、+等
  • 特殊字符参考意义:

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions

2.2.1 边界符
  • 用来提示字符所处的位置
边界符 说明
^ 以谁开始
$ 以谁结束
  • ^ 和 $ 结合,必须是精确匹配
  • 举例
var reg = /^abc/ 
console.log(reg.test('abcd')); //true
console.log(reg.test('aacd')); //false
var reg = /^abc$/
console.log(reg.test('abc')); //true
console.log(reg.test('abcd')); //false
console.log(reg.test('abcabc')); //false
2.2.2 字符类

[]表示有一系列字符可供选择,只要匹配其中一个就可以了

var reg =/[abc]/  //只要包含有a,或者包含有c,或者包含有b 都返回为true
console.log(reg.test('a')); //true
console.log(reg.test('bd')); //true
console.log(reg.test('c')); //true
console.log(reg.test('d')); //false
var reg = /^[abc]$/  //三选一 只有a 或只b 或只c 返回true
console.log(reg.test('a')); //true
console.log(reg.test('b')); //true
console.log(reg.test('abcabc')); //false
  • 方括号内部 范围符-
  • 字符类表示有一系列字符可供选择,只要匹配其中-一个就可以了
  • 所有可供选择的字符都放在方括号内
var reg = /^[a-z]$/; // 26个英文字母任何一个字母返回true
console.log(reg.test('a'));  // t
console.log(reg.test('z')); // t
console.log(reg.test(1)); //f
console.log(reg.test('A')); //f

字符组合

var reg = /^[a-zA-Z]$/; //包含任意一个 26个英文字母都可 不区分大小写
var reg = /^[a-zA-Z0-9]$/; //26个字母加数字 
console.log(reg.test('a')); //t
console.log(reg.test('B')); //t
console.log(reg.test(8)); //t 
console.log(reg.test('Aa1')); //f 只能有一个

/^[^a]$/: 方括号内部 取反符

var reg = /^[^a-zA-Z0-9]$/
console.log(reg.test('a')); //f
console.log(reg.test('B')); //f
console.log(reg.test(8)); //f 
2.2.3 量词符
  • 用来设定某个模式出现的次数
量词 说明
* 重复零次或更多次
+ 重复一次或更多次
重复零次或一次
{n} 重复n次
{n,} 重复n次或更多次
{n,m} 重复n到m次

实例:

var reg = /^a*$/ //>=0 可以不出现 或者出现任意次
console.log(reg.test(''));  //t
console.log(reg.test('aaaaaa')); //t

var reg = /^a+$/ //>=1 必须出现一次 或者出现任意次
console.log(reg.test(''));  //f
console.log(reg.test('aaaaaa')); //t

var reg = /^a?$/ // 1||0 要么不出现 出现只能出现一次
console.log(reg.test(''));  //t
console.log(reg.test('a'));  //t
console.log(reg.test('aaaaaa')); //f
var reg = /^a{3}$/ // 只能出现3次
console.log(reg.test(''));  //f
console.log(reg.test('a'));  //f
console.log(reg.test('aaa')); //t

var reg = /^a{3,}$/ // 大于等于3次 
console.log(reg.test(''));  //f
console.log(reg.test('aa'));  //f
console.log(reg.test('aaa')); //t
console.log(reg.test('aaaa')); //t

var reg = /^a{3,6}$/ // 大于等于3 小于等于6 
console.log(reg.test('a'));  //f
console.log(reg.test('aaaa'));  //t
console.log(reg.test('aaaaaaa')); //f
  • 实际开发一般是判断模式出现的次数
  • 量词与模式之间不要有空格
var reg = /^[a-zA-Z0-9]{6,16}$/; //26个字母加数字  每个符号出现的次数必须在6~16之间
console.log(reg.test('aaa')); //f
console.log(reg.test('dsd6s3d56')); //t
2.2.4 括号总结(正则验证网站)
  1. 中括号[]:字符集合,匹配方括号中的任意字符
var reg = /^[abc]$/  //多选一
  1. 大括号{}:量词符,里面表示重复次数
var reg = /^abc{3}$/  //c重复3次
console.log(reg.test('abcabcabc')); //f
console.log(reg.test('abccc')); // t
  1. 小括号():表示优先级
var reg = /^(abc){3}$/  //abc重复3次
console.log(reg.test('abcabcabc')); //t
console.log(reg.test('abccc')); // f

在线验证正则表达式以及一些常用正则表达式

2.3 正则表达式的特殊字符

2.3.1 预定义类
  • 某些常见模式的简写方式
预定类 说明
\d 匹配0-9之间的任一数字, 相当于[0-9]
\D 匹配所有0-9以外的字符(非数字),相当于[^0-9]
\w 匹配任意的字母、数字和下划线,相当于[A-Za-z0-9 ]
\W 除所有字母、数字和下划线以外的字符,相当于[^A-Za-z0-9 ]
\s 匹配空格(包括换行符、制表符、空格符等),相等于[ \tIrln\W\f]
\S 匹配非空格的字符,相当于[^ \t\r\n\w\f]

案例:
座机号码验证:全国座机号码 两种格式:010-12345678 或 0530-1234567

var reg = /^\d{3}-\d{8} | \d{4}-\d{7}&/ 
var reg = /^\d{3,4}-\d{7,8}$/ 

注意:

  • 正则中|表示
  • 写法不唯一

2.4 正则表达式中的替换

2.4.1 replace()
  • 替换字符串操作
str.replace(str/reg,replacestr)
  • 第一个参数:被替换的字符串或者正则表达式
  • 第二个参数:替换为的字符串
  • 返回值是一个替换完毕的新字符串
  • 只能替换第一个匹配的字符串
    【JavaScript】正则表达式主要知识点总结_第1张图片
2.4.2 正则表达式的参数
/表达式/[switch]

switch(修饰符):按照什么样的模式来匹配

修饰符 说明
g 全局匹配
i 忽略大小写
gi 全局匹配+忽略大小写
reg.replace(/激情| xxx/g,'**') // 执行全局匹配

【JavaScript】正则表达式主要知识点总结_第2张图片

你可能感兴趣的:(JS,leetcode,javascript,前端,正则表达式)