正则表达式（一）入门篇

1. 简介 

英文名 regular expression

英文简称 RegExp

用途：用来处理字符串的规则（学正则就是用来制定规则）

• 只能处理字符串
• 它是一个规则：可以验证字符串是否符合某个规则（test），也可以把字符串中符合规则的内容捕获到（exec / match...）

2. 编写正则表达式

2.1 两种创建方式

// 举例：规则为：全局检测多位数字的字符串
// 1. 字面量创建方式（两个斜杠之间包起来的，都是用来描述规则的元字符）
let reg1 = /\d+/; //（\d表示0到9之间的数）
let reg1 = /\d+/g; //（\d表示0到9之间的数，g表示全局匹配）

// 2. 构造函数模式创建  两个参数：元字符字符串，修饰符字符串
let reg2 = new RegExp("\\d+","g");// 构造函数因为传递的是字符串，\需要写两个才代表斜杠

2.2 两种创建方式的区别

// 场景需要：正则表达是中的部分内容是变量存储的值
// 1. 两个斜杠中间包起来的都是元字符（如果正则中要包含某个变量的值，则不能使用字面量方式创建）
let type = "JavaScript";
reg = /^@"+type+"@$/; 
console.log(reg.test("@JavaScript@")); //=>false
console.log(reg.test('@"""JavaScripttttttt"@')); //=>true

// 2. 这种情况只能使用构造函数方式（因为它传递的规则是字符串，只有这样才能进行字符串拼接）
reg = new RegExp("^@"+type+"@$");
console.log(reg.test("@JavaScript@"));//=>true

3 基础规则语法

3.1 元字符

3.1.1 常用的元字符

常用元字符一定要背下来！

元字符和修饰符就代表制定正则的规则。想要学会正则，就要背会规则。

/*常用的元字符*/
// 1. 量词元字符：设置出现的次数
*    零到多次  
+    一到多次
?    零次或者一次（即 有或无）
{n}    出现n次
{n,}   出现n到多次
{n,m}  出现n到m次

// 2. 特殊元字符：单个或者组合在一起代表特殊的含义
\    转义字符（普通->特殊->普通）
.    除\n（换行符）以外的任意字符
^    以哪一个元字符作为开始（开始标志）
$    以哪一个元字符作为结束（结束标志）
\n   换行符
\d   0~9之间的一个数字
\D   非0~9之间的一个数字 （大写和小写的意思是相反的）
\w   数字、字母、下划线中的任意一个字符
\s   一个空白字符（包含空格、制表符、换页符等）
\t   一个制表符（一个TAB键：四个空格）
\b   匹配一个单词的边界
x|y     x或者y中的一个字符
[xyz]   x或者y或者z中的一个字符
[^xy]   除了x/y以外的任意字符
[a-z]   指定a-z这个范围中的任意字符  [0-9a-zA-Z_]===\w
[^a-z]  上一个的取反“非”
()    正则中的分组符号（分组、捕获、引用）（用法在后续章节（三）中）
(?:)  只匹配不捕获
(?=)  正向预查
(?!)  负向预查 

// 3. 普通元字符：代表本身含义
/javascript/ 此正则匹配的就是 "javascript"

3.1.2 元字符详解

^ $    开始结尾符

let reg = /^\d/; // 制定规则为: 以0~9的任一数字开头

// reg.test("str1") // 表示：str1这个字符串是否符合reg这个规则
console.log(reg.test("JavaScript")); //=>false
console.log(reg.test("2020JavaScript")); //=>true
console.log(reg.test("JavaScript2020")); //=>false

let reg = /\d$/; // 制定规则为: 以0~9的任一数字结尾
console.log(reg.test("JavaScript")); //=>false
console.log(reg.test("2020JavaScript")); //=>false
console.log(reg.test("JavaScript2020")); //=>true

// ^ $ 两个都不加，表示：字符串中包含符合规则的内容即可
let reg1 = /\d+/;
// ^ $ 两个都加，表示：字符串只能是和规则一致的内容
let reg2 = /^\d+$/;

// 举个例子：验证手机号码（规则为：11位，第一个数字是1即可）
let reg = /^1\d{10}$/;

console.log(reg.test("12345678900")); //=>true
console.log(reg.test("22222222222")); //=>false

.    除\n外任意字符

// .不是小数点，是除\n外的任意字符
let reg = /^2.3$/;
console.log(reg.test("2.3")); //=>true
console.log(reg.test("2@3")); //=>true
console.log(reg.test("23")); //=>false

// 基于转义字符，让其只能代表小数点
reg = /^2\.3$/;
console.log(reg.test("2.3")); //=>true
console.log(reg.test("2@3")); //=>false

// 转义字符练习
let str = "\\d";
reg = /^\d$/; //=>\d代表0-9的数字
console.log(reg.test(str)); //=>false
reg = /^\\d$/; //=>把特殊符合转换为普通的
console.log(reg.test(str)); //=>true

x|y    x或y中任意字符 

let reg = /^18|29$/; // 此写法制定规则可组合方式太多了
console.log(reg.test("18")); //=>true
console.log(reg.test("29")); //=>true
console.log(reg.test("129")); //=>true
console.log(reg.test("189")); //=>true
console.log(reg.test("1829")); //=>true
console.log(reg.test("829")); //=>true
console.log(reg.test("182")); //=>true
// 直接x|y会存在很乱的优先级问题，一般我们写的时候都伴随着小括号进行分组，因为小括号改变处理的优先级

reg = /^(18|29)$/; // 制定规则为固定为：18或者29
console.log(reg.test("18")); //=>true
console.log(reg.test("29")); //=>true
console.log(reg.test("129")); //=>false
console.log(reg.test("189")); //=>false

[]    代表其身体内字符的本身含义。即在其身体内任选一个。

//1.中括号中出现的字符一般都代表本身的含义
let reg = /^[@+]$/;
console.log(reg.test("@")); //=>true
console.log(reg.test("+")); //=>true
console.log(reg.test("@@")); //=>false
console.log(reg.test("@+")); //=>false

reg = /^[\d]$/; //=>\d在中括号中还是0-9
console.log(reg.test("d"));//=>false
console.log(reg.test("\\"));//=>false
console.log(reg.test("9"));//=>true

//2.中括号中不存在多位数
reg = /^[18]$/;
console.log(reg.test("1")); //=>true
console.log(reg.test("8")); //=>true
console.log(reg.test("18")); //=>false

reg = /^[10-29]$/; //=>1或者0-2或者9，此写法需要注意，一定不要潜意识给加（）
console.log(reg.test("1")); //=>true
console.log(reg.test("9")); //=>true
console.log(reg.test("0")); //=>true
console.log(reg.test("2")); //=>true
console.log(reg.test("10")); //=>false

3.2 修饰符

/*
 * 正则表达式常用的修饰符
 * 简记 img
 */
i =>ignoreCase  忽略单词大小写匹配
m =>multiline   可以进行多行匹配
g =>global      全局匹配

/* 
/A/.test('lalala')  =>false
/A/i.test('lalala') =>true
*/

 

恭喜你学完简单的制定规则！

请看第二篇，常用规则详解。