JavaScript 正则表达式

正则表达式

基础知识点

// 正则表达式是一种微型语言
// /^(?=\D+\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9_-]{8,16}$/

	  //  /正则的内容/正则修饰符
      //字面量创建  不能使用变量
      var reg=/a/g

      // 构造函数创建 new RegExp(正则内容,修饰符)  可以使用变量
      var reg=new RegExp("a","g")

方法

使用方式

// var reg=/a/ig
//其中 a 表示查找字符串中是否有a元素
//修饰符 g 全局查找 从头查找到尾   i 不区分大小写  m 多行 (i,g可以任意顺序)


	var str = "abacdAC"
     var reg=/a/;
     str=str.replace(reg,"0")//替换了第一个a
     console.log(str)//0bacdAC 

     var reg=/a/g
     str=str.replace(reg,"0")//替换了小写的a
     console.log(str)//0b0cdAC 

     var reg = /a/gi
     str = str.replace(reg, "0")//无论大小写都被替换
     console.log(str)//0b0cd0C

reg.exec()

/* 
reg.exec("abac") 在后面的字符中查找字符a,返回一个数组
0 就是被查找到元素 a
input 查找到字符串"abac"
index 被查找到元素的下标
*/
      var reg=/a/g
      console.log(reg.exec("abac"))

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

reg.test()

	  //reg.test("bac") 判断当前字符串中是否有满足正则的内容,返回一个布尔值
      var str = "i like javascript"
      if (/like/.test(str)) {
          if (str.includes("like")) {
             console.log("这个字符串中有like")
          }
       }

       var str = "bancad"
      var reg = /a/g
      // 每一次同一个正则test执行时都会记录当前查找到的位置,如果使用修饰符g下次将会从上次查找到的位置后开始继续查找
      console.log(reg.test(str))//true
      console.log(reg.test(str))//true
      console.log(reg.test(str))//false
      console.log(reg.test(str))//true
      console.log(reg.test(str))//true
      console.log(reg.test(str))//fasle 

       var str = "bancad"
      // 此方式 每次都是一个新的正则表达式(不是同一个),所以不会对下次有影响
      console.log(/a/g.test(str))//true
      console.log(/a/g.test(str))//true
      console.log(/a/g.test(str))//true
      console.log(/a/g.test(str))//true */


//reg.exec() 同理
      var str="bancad"
      var reg=/a/g
      console.log(/a/g.exec(str))
      console.log(/a/g.exec(str))
      console.log(/a/g.exec(str))
      console.log(/a/g.exec(str))
      console.log(/a/g.exec(str))
      console.log(/a/g.exec(str))

字符串方法用于正则表达式

match() matchAll()

//match() 查找到符合正则内容组成的数组 
      var str = "bancad"
      console.log(str.match(/a/g))//(2) ['a', 'a']

//matchAll() 查找到所有符合内容组成的数组
	 //必须使用g全局查找
      for (var value of str.matchAll(/a/g)) {
         console.log(value)
          //['a', index: 1, input: 'bancad', groups: undefined]
          //['a', index: 4, input: 'bancad', groups: undefined]
      }

replace() 替换 replaceAll()

//replace()	 
	 var str = "bancad"
      str = str.replace(/a/, "A")
      console.log(str)//bAncad

	
      str = str.replace(/a/g, function (item, index, str) {
         if (index === 0) return "A"
         return "B"
      })
      console.log(str)//bBncBd



//replaceAll() 替换所有符合正则内容的元素
//必须使用g全局查找
      var str = "bancadrat"
      str=str.replaceAll(/a/g,"A")
      console.log(str)//bAncAdrAt

      str=str.replaceAll("a","B")
      console.log(str)//bBncBdrBt

      str=str.replace(/a/g,"C");
      console.log(str)//bCncCdrCt

split()

	 //str.split()  根据正则切割为数组
      var str = "a=2&b=3&d=4"
      //切割&或=
      console.log(str.split(/&|=/))
      //(6) ['a', '2', 'b', '3', 'd', '4']

search()

//str.search() 不使用全局 查找多个 找到一个符合条件的就返回他的索引值	
      var str = "abcdeab"
      console.log(str.search(/b|e/))//1

元字符

使用方法

// . 元字符  是一个通配符,代表了任意一个字符
      var str = "abacad";
      // console.log(str.match(/ac/))
      //['ac', index: 2, input: 'abacad', groups: undefined]

      console.log(str.match(/a./))
      //['ab', index: 0, input: 'abacad', groups: undefined]
      console.log(str.match(/a./g))//(3) ['ab', 'ac', 'ad']

      // .. 就任意两个字符
      var str = "abcacdade";
      console.log(str.match(/a../g));//(3) ['abc', 'acd', 'ade']

转义 \

// \.  表示将元字符转换成为普通字符  转义	
//使用\转义任何非字母字符,都会恢复该非字母字符本身含义

	 var str="aba.ac"
      //即让. 变成一个字符串 不在有元字符的作用
      console.log(str.match(/a\./g))//['a.']

      var str="a(b)c"
      console.log(str.match(/(b)/))
      console.log(str.match(/\(b\)/))
      //['(b)', index: 1, input: 'a(b)c', groups: undefined]

筛选 [ ]

//[] 筛选 筛选[]中任意一个字符匹配
	 var str="abacad";
      console.log(str.match(/a[bd]/g))
		//(2) ['ab', 'ad']

      var str="aba.ac";
      // .放在[]中将会转义为字符
      console.log(str.match(/a[.c]/g))
		//(2) ['a.', 'ac']
	 var str="agshjd3456789fghjk-"
      //在[0123456789]中根据str 任意取一个值
     //因为有g 所以会取到全局字符
      console.log(str.match(/[0123456789]/g))
      //(7) ['3', '4', '5', '6', '7', '8', '9']

      console.log(str.match(/[0-9]/g))//(7) ['3', '4', '5', '6', '7', '8', '9']

      console.log(str.match(/[a-z]/g))//(11) ['a', 'g', 's', 'h', 'j', 'd', 'f', 'g', 'h', 'j', 'k']

      console.log(str.match(/[A-Z]/g))

      //只任意筛选[3-8]内的数字
      console.log(str.match(/[3-8]/g))//(6) ['3', '4', '5', '6', '7', '8']

	 // - 前后没有内容的情况就是普通字符 -
      console.log(str.match(/[0-]/g))//['-']

	 console.log(str.match(/[0-9a-zA-Z]/g))
      //(18) ['a', 'g', 's', 'h', 'j', 'd', '3', '4', '5', '6', '7', '8', '9', 'f', 'g', 'h', 'j', 'k']

[ ]注意

/*
[a-z] :匹配小写字母从a-z中的任一字符
[A-Z] :匹配大写字母从A-Z中的任一字符
[0-9] :匹配数字从0-9任一字符,相当于\d
[0-9a-z] :匹配数字从0-9或小写字母从a-z任一字符
[0-9a-zA-Z] :匹配数字从0-9,小写字母从a-z或者是大写字母从A-Z的任一字符

[^a-z] :匹配除小写字母从a-z以外的任一字符
[^0-9] :匹配除数字从0-9以外的任一字符
[^abcd] :匹配除abcd以外的任一字符

反义

//反义 [^内容] 不要[]中的任意字符串,要其他的字符
// [^abc] 除了abc三个字符以外的其他任意一个字符
// ^必须写在[]刚开始的位置
//如果将^写在[]的其他位置,就是^的其他作用
      var str="abcf^a"
      console.log(str.match(/[^ab]/g))//(3) ['c', 'f', '^']
      console.log(str.match(/[a^b]/g))//(4) ['a', 'b', '^', 'a']
      console.log(str.match(/[^\^]/g))//(5) ['a', 'b', 'c', 'f', 'a']  除了^以外的任意一个字符

简写 (※)

/*
\w=[a-zA-Z0-9_]
\W=[^a-zA-Z0-9_]
\d=[0-9]
\D=[^0-9]
\s=空白字符
\S=非空白字符
	 var str="aa bb cc"
      //把空白字符替换
      str=str.replace(/\s/g,"")
      console.log(str)//aabbcc

      //split会返回一个数组
      var arr=str.split(/\s/)
      console.log(arr)//['aabbcc']

      //查找非空白字符
      console.log(str.match(/\S/g))
      //(6) ['a', 'a', 'b', 'b', 'c', 'c']

      var str="   ahksdhkjsadh    alkdkasjd   ajksdakjds  ";
      //方式一
      str=str.replace(/\s/g,"")
      console.log(str)//ahksdhkjsadhalkdkasjdajksdakjds

      //方式二  先找出非空白字符 再把他们连接在一起
      str=str.match(/\S/g).join("")
      console.log(str)//ahksdhkjsadhalkdkasjdajksdakjds

案例

// 要求只能输入数值/字符
var inputs = document.getElementById("inputs")
      inputs.oninput = function () {
         // console.log(inputs.value)
         //把除了0-9的字符替换成""
         // inputs.value=inputs.value.replace(/\D/g,"")
         //把除了a-z(无论大小写)的字符  替换成""
         inputs.value = inputs.value.replace(/[^a-z]/gi, "")
      }

重复

//元素{n} 元素重复n次**
//{n} 这里仅针对{}的前一个元素重复几次**

 var str="2024-04-19"
console.log(/\d\d\d\d-\d\d-\d\d/.test(str))//true

console.log(/\d{4}-\d{2}-\d{2}/.test(str))//true

console.log(/\d{4}(-\d{2}){2}/.test(str))//true
//以上三个形式一样

var str="adcde"
      //在[a-z]根据str 重复任意取值3次
      console.log(str.match(/[a-z]{3}/g))//['adc']

      var tel="18767809854";
      //在[0-9]根据tel 重复任意取值11次
      console.log(tel.match(/\d{11}/))
      //['18767809854', index: 0, input: '18767809854', groups: undefined]

注意点

var str="adcde"
      //{0}表示没有 代表"" 任何字符,任何元字符重复{0}都是""
      console.log(str.match(/.{0}/g))
		//(6) ['', '', '', '', '', '']
      console.log(str.match(/a{0}/g))
		//(6) ['', '', '', '', '', '']

特殊

//{n,m} 最小重复n次,最大重复m次
      var str = "abc1235de5fg12df234";
      console.log(str.match(/\d{2,4}/g))//['1235', '12', '234']
	 var str="12312412";
        // 首先做贪婪匹配 先匹配最多的次数
     console.log(str.match(/\d{0,3}/g));

	// 非贪婪匹配
    // .*?
    // .+?


//元素{0,1} 匹配前面的子表达式零次或一次
      var str = "colour";
      console.log(/colou{0,1}r/.test(str));
      var str = "color";//true
      console.log(/colou{0,1}r/.test(str));///true

//{n,} 最小重复n 最大无限次
      var str = "123";
      console.log(str.match(/\d{4,}/g))//null 最小值大于size了
      console.log(str.match(/\d{2,}/g))//['123']

// {0,} 没有到无限次
      str="erdgtfhgjh453678dfghj";
      str=str.replace(/[a-z]{0,}/g,"-");
      console.log(str)//--4-5-3-6-7-8--

简写 (※)

// {0,} = *   匹配前面的子表达式零次或多次,0到多
// {1,} = +	  匹配前面的子表达式一次或多次,1到多
// {0,1} = ?  匹配前面的子表达式零次或一次,0或1
   针对于?后面的

/.*/   .{0,}  任意一个字符重复0到无限次
/.+/   .{1,}  任意一个字符至少有一个字符到无限个字符
/.?/   .{0,1} 任意字符有或者没有

案例

	 var str = "erdgtfhgjh453678dfghj";
      str = str.replace(/[a-z]/g, "")
      console.log(str)//453678
      str = str.replace(/[a-z]{1,}/g, "")
      console.log(str)//453678
      str = str.replace(/[a-z]+/g, "-");
      console.log(str)//-453678-


      var str = "abbbbbbc";
   console.log(str.match(/ab{0,}c/g))//['abbbbbbc']
      console.log(str.match(/a.{0,}c/g))//['abbbbbbc']



var str="中国的古典四大名著是《西游记》《三国演义》《水浒传》《红楼梦》"
      console.log(str.match(/《[^《》]*》/g))
//(4) ['《西游记》', '《三国演义》', '《水浒传》', '《红楼梦》']
      console.log(str.match(/《.*?》/g))
//(4) ['《西游记》', '《三国演义》', '《水浒传》', '《红楼梦》']


var str = "abbbbbbcddddc";
  console.log(str.match(/.*c/g))//['abbbbbbcddddc']

//非贪婪匹配 先匹配最少的次数
  console.log(str.match(/.*?c/g))//(2) ['abbbbbbc', 'ddddc']

起始结束

[^] 写在[]的第一位是反义
^写在正则的开始,就是起始含义
    $是结束符,这个位置后面没有任何内容了,写在$前面的字符就是最后一个字符
    约束了字符串的长度  /^\d{2}$/

	var str="2024-04-19"
      console.log(/\d{4}-\d{2}-\d{2}-/.test(str))//false

      // 完全匹配
      console.log(/^\d{4}-\d{2}-\d{2}$/.test(str))//true

      var str="abcd"
      //看str是否以a开头
      console.log(/^a/.test(str))//true
      //看str是否以d结尾
      console.log(/d$/.test(str))//true
      //^必须放在前面
      console.log(/a^/.test(str))//false

或者

	//或者  |
      var str="abacbd"
      console.log(str.match(/ab|bd/g))//(2) ['ab', 'bd']
      console.log(str.match(/a|b/))//等同于 [ab]


       // ||意味着或者中有空字符
      console.log(str.match(/ab||bd/g))
      //(6) ['ab', '', '', '', '', '']
      console.log(str.match(/|ab|bd/g))
      //(7) ['', '', '', '', '', '', '']
      console.log(str.match(/ab|bd|/g))
      //(5) ['ab', '', '', 'bd', '']

注意点(※)

// ^[1-9]$  1-9
// ^[12]\d$  10-29
// ^3[01]$  30-31
// /^[1-9]$|^[12]\d$|^3[01]$/

案例

//方法1
function adjustDay(year, month, day) {
         var date = new Date(year, month + 1, 0);
         var maxDay = date.getDate();
         switch (maxDay) {
            case 28:
               return /^[1-9]$|^1\d$|^2[0-8]$/.test(String(day))
            case 29:
               return /^[1-9]$|^[12]\d$/.test(String(day))
            case 30:
               return /^[1-9]$|^[12]\d$|^30$/.test(String(day))
            case 31:
               return /^[1-9]$|^[12]\d$|^3[01]$/.test(String(day))
         }
      } 

//方法2
      function adjustDay(year, month, day) {
         var date = new Date(year, month + 1, 0);
         var maxDay = date.getDate();
         var arr = ["^1\\d$|^[0-8]$", "^[12]\\d$", "^[12]\\d$|^30&", "^[12]\\d$|^3[01]$"]
         return new RegExp("^[1-9]$|" + arr[maxDay - 28].test(String(day)))
         switch (maxDay) {
            case 28:
               return /^[1-9]$|^1\d$|^2[0-8]$/.test(String(day));
            case 29:
               return /^[1-9]$|^[12]\d$/.test(String(day));
            case 30:
               return /^[1-9]$|^[12]\d$|^30$/.test(String(day));
            case 31:
               return /^[1-9]$|^[12]\d$|^3[01]$/.test(String(day));
         }
      }

      var bool = adjustDay(2024, 1, 29);
      console.log(bool)

	 var str = "255"
      console.log(/^\d$|^[1-9]\d$|^1\d{2}$|^2[0-4]\d$|^25[0-5]$/.test(str))//true

//匹配ip地址
      var ip = "192.168.254.255"
      console.log(/^(\d|^[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])(\.(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])){3}$/.test(ip))//true

群组

1、群组分类

	// 使用match 不能使用g
      var str="123456789"
      //把str分成 三个三个一组
      console.log(str.match(/(\d{3})(\d{3})(\d{3})/))
	//使用g  不能达成效果
	 console.log(str.match(/(\d{3})(\d{3})(\d{3})/g))//['123456789']

      //()按照先外层再内层,先前再后的方式拆开字符
      var str="abcdef"
      console.log(str.match(/(.{2}(.{2})).{2}/))

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

案例

	var str = "http://www.baid.com/?a=1&b=2&c=3"
      // console.log(str.match(/(\w+)=(\w+)/))
      var m = str.matchAll(/(\w+)=(\w+)/g)
      m.forEach(value => {
         console.log(value)
      });
      var obj = m.reduce((value, item) => {
         value[item[1]] = item[2]
         return value
      }, {})
      console.log(obj)

//隐藏手机号
var tel = "18617809456";
	//方法1
      tel = tel.replace(/^(\d{3})\d{4}(\d{4})$/, function (item, a, b, index) {
         return a + "****" + b
      })
      console.log(tel)//186****9456

	//方法2
      // $1 群组1变量  $2群组2变量
      tel = tel.replace(/^(\d{3})\d{4}(\d{4})$/, "$1****$2")
      console.log(tel)//186****9456

//隐藏身份证号码
var code = "10142220030517503x"
      code = code.replace(/(\d{3})\d{12}(\d{2}[\d|x])/, "$1************$2")
      console.log(code)//101************03x

2、断言

/*
         (?=m) 后置肯定断言
         (?!m) 后置否定断言
         (?<=m) 前置肯定断言
         (?<!m) 前置否定断言
*/


	  var str = "abacad"
      //把a后面是c的那个a替换
      str = str.replace(/a(?=c)/g, 0)
      console.log(str)//ab0cad

      //把a后面不是c的那个a替换
      str=str.replace(/a(?!c)/g,0);
      console.log(str)//0bac0d

      var str="cabada";
      //把a前面是b的那个a替换
      str=str.replace(/(?<=b)a/g,"0")
      console.log(str);//cab0da
      //把a前面不是b的那个a替换
      str=str.replace(/(?<!b)a/g,"0")
      console.log(str);//c0bad0

密码

// (?=\D+\d)  任意非数字起头,一个以上非数字,后面紧跟一个数字    1a(不满足)  a1(满足)  abc1(满足) kashda$$#s1(满足) ajhsdahsd(不满足) aa11(满足)

// (?=.*[a-z]) 任意字符起头0个以上后面紧跟一个小写字母  a  aa $@a(满足)   121(不满足) 整个字符串中必须至少有一个小写字母

// (?=.*[A-Z]) 任意字符起头0个以上后面紧跟一个大写字母  a  aa $@a(不满足)   121(不满足)  aB(满足) 整个字符串中必须至少有一个大写字母


// 强密码
/^(?=\D+\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9_-]{8,16}$/
        
// 弱密码
/^\d{8,16}$|^[a-z]{8,16}$|^[A-Z]{8,16}$/

// 中密码
/^(?=\D+\d)(?=.*[a-z])[a-zA-Z0-9_-]{8,16}$|^(?=\D+\d)(?=.*[A-Z])[a-zA-Z0-9_-]{8,16}$|^(?=.*[A-Z])(?=.*[a-z])[a-zA-Z0-9_-]{8,16}$/

3.重复群组

	  // 重复群组
      // (要查找的相同字符)\1+  一个以上的重复(不包含一个字符)
      // (要查找的相同字符)\1*  一个或者一个以上的重复(包含一个字符)

      var str = "aaaaabbbbbffffddddeeeem"
      console.log(str.match(/(\w)\1+/g))
      //(5) ['aaaaa', 'bbbbb', 'ffff', 'dddd', 'eeee']
      console.log(str.match(/(\w)\1*/g))
      //(6) ['aaaaa', 'bbbbb', 'ffff', 'dddd', 'eeee', 'm']

4、群组名

	 var str = "abc&def";
      console.log(str.match(/(?<prev>\w+)&(?<next>\w+)/))

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

var str = "http://www.baid.com/?a=1&b=2&c=3";
      console.log(str.match(/(?<key>\w+)=(?<value>\w+)/))
      var o = str.matchAll(/(?<key>\w+)=(?<value>\w+)/g).reduce((v, t) => {
         v[t.groups.key] = t.groups.value;
         return v;
      }, {})
      console.log(o)

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

各种验证

// 用户名验证
// /^\w{6,20}$/

// 年龄验证
// /^[1-9]$|^[1-9]\d$|^1[0-3]\d$/

// 出生日期
// /^(19\d{2}|20[01]\d|202[0-4])\/([1-9]|1[0-2])\/([1-9]|[12]\d|3[01])$/

// 邮箱
// /^\w+@\w+\.(com|cn|org|net)(\.(cn|cc|jp|tw|hk))?$/

// 中文姓名
// /^[\u4e00-\u9fd5]{2,10}$/

// qq验证
// /^\d{6,}$/

// 手机验证
// /^1[3-9]\d{9}$/

// 电话
// /^0\d{2,3}-[1-9]\d{6,7}$/

// 强密码
// /^(?=\D+\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9_-]{8,16}$/
        
// 中密码
// /^(?=\D+\d)(?=.*[a-z])[a-zA-Z0-9_-]{8,16}$|^(?=\D+\d)(?=.*[A-Z])[a-zA-Z0-9_-]{8,16}$|^(?=.*[A-Z])(?=.*[a-z])[a-zA-Z0-9_-]{8,16}$/

// 弱密码
// /^\d{8,16}$|^[a-z]{8,16}$|^[A-Z]{8,16}$/

  • 5
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值