正则表达式的简介

1 正则表达式的简介

1.1 什么是正则表达式

正则表达式（Regular Expression）是一种描述字符模式的对象，用于匹配规律规则的表达式。正则表达式进行强大的模式匹配和文本检索与替换功能。

1.2 正则表达式的作用

1. 给定的字符串是否符合正则表达式的过滤逻辑(匹配)
2. 可以通过正则表达式，从字符串中获取我们想要的特定部分(提取)
3. 强大的字符串替换能力(替换)
   提示：对于复杂的正则表达式不用过多研究，在工作都是写好复制的，但是要求根据需求使用正则表达式。

1.3 正则表达式的检测工具

在线测试正则

2 创建对象的两种种方式

2.1 构造函数

var reg = new RegExp(/today/);

2.2 字面量

var reg = /boy/;

3 正则对象的参数

标志	说明
i	忽略大小写
g	全局匹配
m	多行匹配

正则对象的参数可以多个一起使用。

3.1 正则的参数一般跟在 / 后面.

var reg = /today/gi;

4 测试正则表达式的方法

test() 正则对象方法，用于检测字符串是否符合该规则，该对象会返回 true 或 false，其参数是测试字符串。

var reg = /123/;
console.log(reg.test(123));//匹配字符中是否出现123  出现结果为true
console.log(reg.test('abc'));//匹配字符中是否出现123 未出现结果为false

5 正则表达式的组成

• 普通字符abc 123
• 特殊字符：正则表达式中有特殊意义的字符

5.1 边界符

正则表达式中的边界符（位置符）用来提示字符所处的位置，主要有两个字符–精确匹配

边界符	说明
^	匹配行首的文本（以谁开始）
$	匹配行尾的文本（以谁结束）

var str1 = 'student stument stinht utstu';
var str2 = 'stu';
var reg1 = /^stu/;
var reg2 = /stu$/;
var reg3 = /^stu$/; //只匹配以stu开头和结尾的字符串
console.log(reg1.test(str1)); //true
console.log(reg2.test(str1)); //true
console.log(reg3.test(str1)); //flase
console.log(reg3.test(str2)); //true

5.2 字符类

5.2.1 [] 方括号,有一系列字符用中括号括起来，表示匹配其中的任一字符，多选一

// var str1 = 'adasiofhioafsda';
// var reg1 = /[abcd]/;
// var reg2 = /^[a-z]$/;
// var reg3 = /^[a-z]/;
// var reg4 = /[a-z]$/;
// var reg5 = /^[a]$/
// console.log(reg1.test(str1)); //true
// console.log(reg2.test(str1)); //false
// console.log(reg3.test(str1)); //true
// console.log(reg4.test(str1)); //true
// console.log(reg5.test(str1)); //false

5.2.2 量词类

量词	说明
*	出现0次或更多次
+	出现1次或更多次
？	出现0次或1次
{n}	出现n次
{n,}	出现n次或更多次
{n,m}	出现n到m次

var str2 = 'aaaa';
var reg1 = /^a*$/;
var reg2 = /^a+$/;
var reg3 = /^a?$/;
var reg4 = /^a{2}$/;
var reg5 = /^a{3,}$/;
var reg6 = /^a{3,4}$/;
console.log(reg1.test(str2)); //true
console.log(reg2.test(str2)); //true
console.log(reg3.test(str2)); //flase
console.log(reg4.test(str2)); //false
console.log(reg5.test(str2)); //true
console.log(reg6.test(str2)); //true

5.2.3 括号总结

元字符	说明
{}大括号	量词符. 里面表示重复次数
[]中括号	匹配方括号中的任意字符
()小括号	表示优先级

5.3元字符类

元字符	说明
\d	匹配数字，任何ASCII数字，等价于[0-9]匹配一个数字
\D	匹配任意非数字的字符，除了ASCII数字之外的任何字符，等价于[^0-9]
\w	匹配字母或数字或下划线，等价于[a-zA-Z0-9_]
\W	匹配任意不是字母，数字，下划线，等价于[^a-zA-Z0-9_]
\s	匹配任意的空白符[/t/r/n/v/f]
\S	匹配任意不是空白符的字符[^/t/r/n/v/f]
.	匹配除了换行和行结束符的字符
\ .	将特殊字符转义成(.)当成普通字符.

var str1 = 'abcd \nefg\d12345qq.com ';
var reg1 = /\d/;
var reg2 = /\D/;
var reg3 = /\w/;
var reg4 = /\W/;
var reg5 = /\s/;
var reg6 = /\S/;
var reg7 = /./;
var reg8 = /|/;//或者， 选择两者中的一个。 将左右两边分为两部分， 而不管左右两边有多长多乱 
var reg9 = /、./;
console.log(str1.match(reg1)); //["1", index: 10, input: "abcd ↵efgd12345qq.com ", groups: undefined]0: "1"index: 10input: "abcd ↵efgd12345qq.com "groups: undefinedlength: 1__proto__: Array(0)
console.log(str1.match(reg2)); // ["a", index: 0, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg3)); // ["a", index: 0, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg4)); // [" ", index: 4, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg5)); // [" ", index: 4, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg6)); // ["a", index: 0, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg7)); // ["a", index: 0, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg8)); // ["", index: 0, input: "abcd ↵efgd12345qq.com ", groups: undefined]
console.log(str1.match(reg9)); // null

6 正则表达式对象常用的方法

6.1 exec()方法

检测字符串中正则表达式的匹配。如果匹配到了值，就会返回匹配值（一个数组对象里面记录了一些匹配数据）。如果没有匹配到会返回null。
语法：RegExpObject.exec(string)

 var str = 'hello world hello world';
 var reg = /hello/g;
 console.log(reg.exec(str));//["hello", index: 0, input: "hello world hello world", groups: undefined]
 console.log(reg.exec(str));//["hello", index: 12, input: "hello world hello world", groups: undefined]

7 字符串关于正则的方法

search检索与正则表达式相匹配的值，返回找到的字符串的下标，没有找到会返回-1.。本身就有检索字符串的功能。
replace：第一个参数可以为正则对象或者字符串（匹配规则），第二个参数可以是字符串或者一个函数。将依据第一个匹配规则匹配到的字符替换成第二个参数的字符。如果第二个为函数，会将匹配到的字符作为参数传递进去。第二个参数必须得到一个值，函数需要在内部返回一个值。
用这个做过字符串转换驼峰法。该方法返回改变后的字符串，但是原字符串没有被改变。

var str = "abc,efg,123，abc,123，a";
// search寻找响应的字符
console.log(str.search(/abc/g)); //0
console.log(str.replace(/,|，/g, '.')); //abc.efg.123.abc.123.a

match检索所有与正则表达式相匹配的值，返回由匹配值组成的数组。如果正则对象有g参数，会查找到多个值，否则只找到一次。一次时返回也是数组，里面包含了有关这次查找的信息。没有找到返回null。

var str = 'abcdefghjabcde';
str.match(/a*/);//只匹配一次
str.match(/a*/g);//会进行多次匹配

8 表单input标签支持正则的属性

pattern:当给input添加该属性以后，表单在提交时会自动依据属性值进行匹配，如果不符合条件，会弹出浏览器自定义的警告信息。但是这个属性不是支持所有类型的input。目前来说适用于：text、search、url、telephone、email以及password。
书写格式：

手机号码：<input type="tel" name="tel" class="tel" pattern="^1[3|4|5|7|8]\d{9}$" autocomplete="off" title="This is telephone number">