JS 正则表达式的使用 2022-06-07

正则表达式有两种创建方法:

  • 字面量正则表达式
const pattern=/test/;
#正则修饰符
#i 对大小写不敏感
#g 全局匹配
#m 多行匹配
#y 从最后一个位置开始匹配
exp : const pattern=/test/i; #对大小写不敏感
  • 创建RegExp对象的实例
const pattern=new RegExp("test");
#第二个参数代表字面量中的正则修饰符
const pattern=new RegExp("test","i") #对大小写不敏感
  • 匹配字符集
    匹配字符集使用的是[]
exp : /[abc]/ #表示匹配a/b/c中的任意一个字符,注意是一个
/[^abc]/ #表示匹配除了a/b/c的任意一个字符,^在这里重写,代表非
  • 转义
    使用反斜杠代表转义
    例如在[]中的^代表非,而如果要匹配其本身,则使用/转义
    在字面量中转义仅需要一个/;而在RegExp实例化中需要//
exp : const pattern=/[/^]/; #代表匹配^本身
const pattern=new RegExp("//^"); #注意是双下划线
  • 起止符号
    在[]以外的地方,^代表字符串起始位置;$代表字符串末尾
  • 重复出现
    ? 代表其前面的匹配项出现0次或者1次,可以用于非贪婪模式
exp : const pattern=/a+/可以匹配aaa;而/a+?/则只会匹配一个a

+ 代表其前面的匹配项出现1次或者多次
* 代表其前面的匹配项出现0次或者1次或者多次
/a{4}/ 匹配4个连续的字符a
/a{4,6}/ 匹配4个-6个连续的字符a
/a{4,}/ 匹配4个或者更多个连续的字符a

  • 转义字符
/d 代表数字[0-9]
/D 代表非数字
/w 代表数字、字母、下划线
/W 代表非数字、字母、下划线
/b 空格
/r 回车
/n 换行符
. 除了换行符(/n /r /u2028 /u2029)以外的任意字符
  • 反向引用
/^([dtn])a/1/ 匹配的内容是[dtn]中任意一个+a+第一次匹配到的[dtn]中的任意一个
 /1即代表反向引用
  • 正则表达式的编译
const a1=/test/g;
const a2=new RegExp("test","g");

a1!=a2,因为每个正则表达式都是独一无二的,与原始数据类型(string,number等)不相同

  • 正则表达式的捕获
const match=transfromValue.match(/translateY/(([^/)]+)/)/);

()括号代表一个捕获或者分组,而左右用/则表示转义,即/translateY(([^)]+))/中/(与/)代表匹配()本身,内层()代表捕获;match方法返回捕获到的值,match[0]中存放正则匹配到的所有结果,match[1]中存放的是()中捕获到的内容

const html="
this is a test
"; const results=html.match(/<(//?)(/w+)([^>]*?)>/); const all=html.match(/<(//?)(/w+)([^>]*?)>/g);

results[0]=="

"
results[1]==""
results[2]=="div"
results[3]=="class="test""
all[0]=="

"
all[1]==
all[2]==

all[3]==

可以看出局部正则表达式可以获得()中定义的3个捕获,全部正则表达式不能

const tag=/<(//?)(/w+)([^>]*?)>/g;
const match=tag.exec(html);

上述匹配或者捕获也可以使用正则的exec()方法,exec()方法使用全局匹配,返回每一次的局部的匹配以及捕获的结果

  • 捕获的引用(难度:***)
#反向引用
const html="helloworld!";
const pattern=/<(/w+)([^>]*?)>(.*?)/g;
#replace方法配合$1 $2的引用方法
“fontFamily”.replace(/([A-Z])/g,"-$1")=="fontfamily";
#-$1代表匹配到的第一个大写字母
#replace仅仅返回()中的捕获!
const pattern=/((?:ninjia-)+)sword;
const ninjia="ninjia-ninjia-sword".match(pattern);

?:代表不创建捕获,这样内层()仅仅代表分组,外层()代表捕获

版权声明:
作者:dingding
链接:https://www.techfm.club/p/43433.html
来源:TechFM
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>