正则表达式的使用

最新推荐文章于 2025-05-18 18:08:02 发布

原创最新推荐文章于 2025-05-18 18:08:02 发布 · 565 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#正则表达式 #javascript #前端

写在前面

本文只是个人学习之后的理解，写出来一是便于初学者学习；二是自己忘记的时候提醒一下自己。

本文也仅限于个人对正则的理解，若有错误欢迎各位大佬指出。

文章的小开头：我永远喜欢霞之丘诗羽！

正则表达式

正则表达式简介

JavaScript 中的 RegExp 对象

正则：某种特定的规则

表达式：由一些普通字符和特殊字符组成

是强大的字符串匹配工具。

用事先定义好的一些特定字符、及这些特定字符的组合，组成一个规则字符串，这个规则字符串用来对字符串进行匹配，然后做相应的操作，如过滤、替换、判定等。

正则表达式测试工具：

– https://rubular.com/r/xfQHocREGj

– https://jex.im/regulex/

创建正则表达式（推荐使用字面量方式）

字面量方式 /pattern/ flags (加粗为常用的)

var box = /box/;       直接用两个斜杠

var box = /box/ig;    在第二个斜杠后面加上模式修饰符

new运算符 new RegExp(pattern, flags)(加粗为常用的)

var box = new RegExp('box'); //第一个参数为正则字符串或正则字面量
var box = new RegExp(/box/);

var box = new RegExp('box','ig');//第二个参数可选模式修饰符字符串

修饰符

每个正则表达式都可带一个或多个标志（flags）,标明正则表达式的行为。

在这里插入图片描述

g是匹配到一个以后继续往后找，不加g匹配到一个后就会停止匹配。

加m是每一行都匹配，不加m只匹配第一行。

转义字符

具有特殊含义的字符，不能直接匹配使用的，必须使用反斜线（\）作为前缀进行转义后才能使用。

在这里插入图片描述

字符串、正则表达式构造函数都使用反斜线（\）作为转义字符的前缀。

创建正则表达式两种形式的优缺点

推荐优先使用字面量形式创建正则表达式，但使用构造函数的方式可以传入变量。

	var pattern =/^\\d+/g
	
	var pattern = new RegExp("^\\d+","g");   注意，反斜杠需要转义

构造函数方式，涉及到转义字符时，需要多写一个 \

构造函数的匹配模式可以使用变量，但是字面量不能够使用变量代替。

与正则相关的方法

RegExp原型方法（使用方法：正则表达式调用该方法并传入字符串为参数）

test() 匹配是否满足规则

exec() 不仅匹配是否满足规则，还会得到更多信息并输出，比如字符位置

regObject.test(str);

regObject.exec(str);

在这里插入图片描述

String原型方法（使用方法：字符串调用该方法并传入正则表达式为参数）

replace()替换

match()匹配

search()查找

split()拆分

replace()方法

strObject.replace(regexp,‘replaceString’);

对字符串中特定格式的子串进行替换，返回替换后的结果

第一个参数既可以是一个固定的子串，也可以是一个正则表达式对象

match方法

strObject.match(regexp);

一个或多个子串、正则表达式的匹配

返回一个数组

search()方法

strObject.search(regexp);

返回第一次出现匹配指定正则表达式子串的下标，若没有匹配则返回 -1

与indexOf() 作用类似，但 indexOf() 不支持正则表达式

split()方法

strObject.split(regexp,[howmany]);

用一个指定的字符串或正则表达式，对原字符串进行拆分，返回拆得的子串数组

若指定了 howmany 属性，则只返回拆得的前 howmany 个子串

正则表达式符号

元字符

元字符是拥有特殊含义的字符。

在这里插入图片描述

锚字符

锚字符用于查找某个位置。

在这里插入图片描述
exp 在这里代表任意表达式。

位置是指字符串中每行第一个字符的左边、最后一个字符的右边以及相邻字符的中间。比如，下图中箭头所指的地方

在这里插入图片描述
对于位置的理解，我们也可以理解成空字符"" ，即在字符串的开头、结尾以及每个字符之间都加了一个空字符""。

在这里插入图片描述

边界

边界（\b） —— \w 与 \W 之间的位置

\w 是字符组 [ 0-9 a-z A-Z _ ] 的简写形式

\W 是排除字符组 [^0-9 a-z A-Z _ ] 的简写形式

^ $ 位置也是边界

例子：

    //   \b	  匹配字符串的边界  开头或者结尾
    //var pattern = /8\b/mg; 输出：8pattern$ 8pattern$
    //var pattern = /\b8/mg; 输出：$pattern8 $pattern8
    var str = '8pattern8\n8pattern8';
    console.log(str.replace(pattern, "$"));

零宽断言

(?=exp) —— 零宽度正预测先行断言

断言此位置的后面能匹配表达式 exp

(?!exp) —— 零宽度负预测先行断言

断言此位置的后面不能匹配表达式 exp

    //   (?=exp)	  匹配其后紧接 exp 的字符串
    //  零宽正向先行断言，要求接下来的字符都与  exp  匹配，但不包括 匹配 exp 的那些字符
    var pattern = /utaha/ig;
    //var pattern = /java(?=script)/ig;
    var str = "utahaScript is same as utaha!";
    console.log(str.replace(pattern, "$"));


    //   (?!exp)匹配其后没有紧接 exp 的字符串
    //   零宽负向先行断言，要求接下来的字符都与  exp  不匹配
    var pattern = /utaha(?!script)/ig;
    var str = "utahaScript is same as utaha!";
    console.log(str.replace(pattern, "$"));

方括号

方括号用于查找某个范围内的单个字符。
在这里插入图片描述

[A-z0-9_] 匹配英文字母、数字、下划线

在这里插入图片描述

量词

量词是定义字符出现频次的字符。

在这里插入图片描述

贪婪和惰性

贪婪匹配：尽可能多的匹配

惰性匹配：尽可能少的匹配

默认是按贪婪匹配。

在这里插入图片描述

	var pattern1 = /78{2,8}\d/g;
	var pattern2= /78{2,8}?\d/g;
	var str = "12345678888888888d90";
	console.log(str);
	console.log(str.replace(pattern1, "$"));
	console.log(str.replace(pattern2, "$"));