正则基本尝试

正则创建：

方式一：字面量创建（常用）

let str = 'abcdefg';
let reg = /ef/;
let res = str.match(reg)
console.log(res)

在这里插入图片描述

方式二：构造函数创建

let str = 'abcdefg';
let reg = new RegExp("ef","g");
let res = str.match(reg)
console.log(res)

在这里插入图片描述

正则匹配方法：

一、正则方法
1.test

let str = 'adab1211nnnn323';
let reg = /11/;
console.log(reg.test(str))   //返回Boolean值 true

2.exec

let str = 'adab1211nnnn323';
let reg = /\d+/;
console.log(reg.exec(str))

在这里插入图片描述

二、字符串方法
1.match

let str = 'adab1211nnnn323';
let reg = /\d+/;
console.log(str.match(reg))

在这里插入图片描述

2.split

let str = 'ad1ab1211nn2nn323sd';
let reg = /\d+/;
console.log(str.split(reg))

在这里插入图片描述

3.search 查找第一次出现的位置，没找到返回-1

let str = 'das12dasd12dads';
let reg = /12/;
let res = str.search(reg);
console.log(res)

4.replace 替换

let str = 'das12dasd12dads';
let reg = /\d/g;
let res = str.replace(reg,'*');
console.log(res)   //das**dasd**dads

三、元字符（正则中有特殊含义的非字母字符）

. * + $ ^ | \ ()  [] {}

字符	描述
.	匹配除换行符 \n、\r 、\u2028或\u2029之外的任何单个字符。
*	匹配前面的子表达式零次或多次。例如，zo* 能匹配 "z" 以及 "zoo"。* 等价于{0,}。
+	匹配前面的子表达式一次或多次。例如，'zo+' 能匹配 "zo" 以及 "zoo"，但不能匹配 "z"。+ 等价于 {1,}。
^	匹配输入字符串的开始位置。如果设置了 RegExp 对象的 Multiline 属性，^ 也匹配 '\n' 或 '\r' 之后的位置。
$	匹配输入字符串的结束位置。如果设置了RegExp 对象的 Multiline 属性，$ 也匹配 '\n' 或 '\r' 之前的位置。
\	可以让有特殊含义的字符变成字面量含义字符。
[a-z]	字符范围。匹配指定范围内的任意字符。例如，'[a-z]' 可以匹配 'a' 到 'z' 范围内的任意小写字母字符。
[^a-z]	负值字符范围。匹配任何不在指定范围内的任意字符。例如，'[^a-z]' 可以匹配任何不在 'a' 到 'z' 范围内的任意字符。
x|y	匹配 x 或 y。例如，'z|food' 能匹配 "z" 或 "food"。'(z|f)ood' 则匹配 "zood" 或 "food"。
\b	匹配一个单词边界，也就是指单词和空格间的位置。例如， 'er\b' 可以匹配"never" 中的 'er'，但不能匹配 "verb" 中的 'er'。
\B	匹配非单词边界。'er\B' 能匹配 "verb" 中的 'er'，但不能匹配 "never" 中的 'er'。
\w	匹配字母、数字、下划线。等价于'[A-Za-z0-9_]'。
{n}	n 是一个非负整数。匹配确定的 n 次。例如，'o{2}' 不能匹配 "Bob" 中的 'o'，但是能匹配 "food" 中的两个 o。

【完成元字符表】

字符集合 [],某一类字符

let str = 'dasdasda121dasd';
let reg = /[da]/g;    //这里表示匹配的是d或者a
let res = str.replace(reg,'*')
console.log(res) //**s**s**121**s*

let str = 'this knife is 5km';
let reg = /[kdc][mM]/g;  
//这里的第一个中括号代表的是一位k或d或c，第二个中括号代表的是一位m或M
let res = str.replace(reg,'米')
console.log(res)  //this knife is 5米

\d 匹配数字字符，相当于[0-9]
\D 匹配非数字字符，相当于[^0-9]

// \d 匹配数字字符，相当于[0-9] 
let str = 'abbd121212dada121';
let reg = /\d+/g; 
let res = str.replace(reg,'*')
console.log(res) //abbd*dada*

let str = 'abbd121212dada121';
let reg = /[0-9]+/g; 
let res = str.replace(reg,'*')
console.log(res) //abbd*dada*

// \D 匹配非数字字符，相当于[^0-9]
let str = 'abbd121212dada121';
let reg = /\D+/g; 
let res = str.replace(reg,'*')
console.log(res) //*121212*121

let str = 'abbd121212dada121';
let reg = /[^0-9]+/g; 
let res = str.replace(reg,'*')
console.log(res) //*121212*121

• . ===> [^\r\n] 除了换行和回车之外匹配的所有的字符
• \d ===> [0-9] 所有的数字
• \w ===> [0-9a-zA-Z_] 数字、字符、下划线

// 边界
^ $   // 以什么开头，以什么结尾
\b   单词边界(如果遇到非\w的就认为是有边界)
\B  非单词边界

let str = 'is this is book';
let reg = /\bis\b/g; //前后空格 还有开头都是属于单词边界 
let res = str.replace(reg,'*')
console.log(res)  //* this * book

分组（）

let str = 'I am lilei';
let reg = /li(L|l)ei/g;  //此处的括号表示匹配 L 或 l
let res = str.replace(reg,'李磊')
console.log(res)  //I am 李磊

let str = 'wedasda121234sd1231';
let reg = /(\d+)|([a-z]+)/; 
let res = str.match(reg)
console.log(res)  //[ 'wedasda', '121234', 'sd', '1231' ]

命名分组    ==> es2018新增 ==>es9

let str = 'wedasda121234sd1231';
let reg = /(\d+)|([a-z]+)/; 
let res = str.match(reg)
console.log(res)  //[ 'wedasda', '121234', 'sd', '1231' ]

let str = 'wedasda121234sd1231';
let reg = /(\d+)|(?<mystr>[a-z]+)/; 
let res = str.match(reg)
console.log(res) 

//这个时候会将匹配的到的值放在groups里面，没有匹配到则是undefind
// 我们通过res.groups.mystr  获取到匹配的值,数据样式如下截图

在这里插入图片描述

零宽断言：正向断言、负向断言

 ===> 正向断言（断言在后）：肯定正向断言，否定正向断言 。 

需求: 将iphone字母后面带有数字的替换成汉字“苹果”

let str = 'iphone3iphone4iphone5iphonenumber';
let reg = /iphone\d/g; 
let res = str.replace(reg,"苹果")
console.log(res)  //苹果苹果苹果iphonenumber

let str = 'iphone3iphone4iphone5iphonenumber';
let reg = /iphone(?=\d)/g;  //肯定正向断言，这样就不会将后面的数字也替换了
let res = str.replace(reg,"苹果")
console.log(res)  //苹果3苹果4苹果5iphonenumber

let str = 'iphone3iphone4iphone5iphonenumber';
let reg = /iphone(?!\d)/g;  // 否定正向断言 将后面没有数字的匹配
let res = str.replace(reg,"苹果")
console.log(res)  // iphone3iphone4iphone5苹果number

==> 负向断言（断言在前）: 肯定负向断言，否定负向断言 。 

需求: 将数字后面的px替换成“像素”

let str = '10px20px30pxipx';
let reg = /\d+px/g; 
let res = str.replace(reg,"像素")
console.log(res)  // 像素像素像素ipx

let str = '10px20px30pxipx';
let reg = /(?<=\d+)px/g;  //肯定负向断言
let res = str.replace(reg,"像素")
console.log(res)  // 10像素20像素30像素ipx

let str = '10px20px30pxipx';
let reg = /(?<!\d+)px/g;  //否定负向断言
let res = str.replace(reg,"像素")
console.log(res)  // 10px20px30pxi像素

反向引用 ===> es2018

//2020-02-01  ===>  01/02/2020
let str = '2020-02-01';   
let reg = /(\d{4})-(\d{1,2})-(\d{1,2})/g
let res = str.replace(reg,'$3/$2/$1')  //此处的$3$2$1是小括号中的分组取值
console.log(res)  //01/02/2020

  {1,} ===> 至少1次
  {0,2} ===>最多2次
 +  ===> {1,}
 +  ===> {0,}
  ? ===> {0,1}

• m ： 表示可以换行匹配

let str = `dasdasd
  dasdasdxxcsad
`
let reg = /^/g;
let res = str.replace(reg,"*")
console.log(res)

未使用m 显示返回如下图，只能匹配到第一行的首位

在这里插入图片描述

let str = `dasdasd
  dasdasdxxcsad
`
let reg = /^/gm;
let res = str.replace(reg,"*")
console.log(res)

使用m后可以换行下图：

在这里插入图片描述

• s：可以让.匹配换行符号

 let str = `<div>454545454erer
er</div>`
let reg = /^<div>.*<\/div>/g;
let res = reg.test(str)
console.log(res)  //false

let str = `<div>454545454erer
er</div>`
let reg = /^<div>.*<\/div>/gs;  //此处加上s后就可以匹配到换行
let res = reg.test(str)
console.log(res)  //true

• u：unicode模式，匹配unicode

let str = "\uD842\uDFB7"
let reg = /^.$/;
let res = reg.test(str)
console.log(res)  //false

let str = "\uD842\uDFB7"
let reg = /^.$/u;
let res = reg.test(str)
console.log(res)  //true

• y ：粘性模式

let str = "12dasda2312dfasdf"
let reg = /\d/g;
console.log(reg.exec(str)) 
console.log(reg.exec(str)) 
console.log(reg.exec(str)) 

在这里插入图片描述

let str = "12dasda2312dfasdf"
let reg = /\d/g;
console.log(reg.exec(str)) 
console.log(reg.exec(str)) 
console.log(reg.exec(str)) 

粘性模式，匹配到index不是0,1,2,3这样连着依次进行的，只是断开的，匹配就会结束

在这里插入图片描述