正则（js）
正则表达式：正则(regular)表达式(expression)
是对字符串操作的一种逻辑公式，就是用事先定义好的一些特殊字符，及这些特定字符的组合，组成一个‘规则字符串’，这个规则字符串用来表达对字符串的一种过滤逻辑。
1、创建
-
字面量创建: /检索字符/修饰符;
-
构造函数创建：new RegExp('检索字符','修饰符');
var re = /a/ig; // a是字符串 var re = new RegExp('a', 'ig'); // a是字符串 // 一般推荐用字面量方式创建，什么时候用构造函数的方式创建？有变量的时候 var a = 'abc'; var re = new RegExp(a, 'ig'); // a是变量
2、正则的方法
1、正则下面的方法
-
test exec
2、字符串下面的方法
-
match split replace search
1、test
-
格式：正则.test(字符串);
-
作用：检索字符串中是否包含正则要检索的内容，有则返回true，没有则返回false
var str = 'abcdefg'; var re1 = /c/; var re2 = /cde/; var re3 = /cef/; console.log(re1.test(str)); // true console.log(re2.test(str)); // true console.log(re3.test(str)); // false
2、exec
-
格式：正则.exec(字符串);
-
作用：检索到正则表达式规定的内容会返回一个数组，检索不到则返回null
var str = 'hello world'; var re1 = /o/; var re2 = /O/; var re3 = /O/i; console.log(re1.exec(str)); // ['o'] console.log(re2.exec(str)); // null console.log(re3.exec(str)); // ['o']
3、match
-
格式：字符串.match(正则);
-
作用：正则去匹配字符串，如果匹配成功，就返回匹配成功的数组，如果匹配不成功，就返回null，跟exec方法类似
-
同exec的区别：识别修饰符g，而exec不识别g
var str = 'hello world'; var re1 = /o/; var re2 = /O/; var re3 = /O/ig; console.log(str.match(re1)); // [ "o" ] console.log(str.match(re2)); // null console.log(str.match(re3)); // [ "o", "o" ]
4、split
-
格式：字符串.split(正则);
-
作用：按正则匹配的内容拆分成数组
var str = 'hello world'; var re = /\s/; console.log(str.split(re)); // ['hello', 'world'] // ------------------------------- var str = '2020-10-10 12:12:12'; var re = /\s|-|:/; console.log(str.split(re)); // [2020,10,10,12,12,12]
5、replace
-
格式：字符串.replace(正则, 新的字符);
-
作用：替换正则匹配的字符串，返回替换以后的内容，不改原字符
var str = "hello web,hello ui,hello java"; var re1 = /hello/; var re2 = /hello/g; console.log(str.replace(re1, '你好')); console.log(str.replace(re2, '你好'));
6、search
-
格式：字符串.search(正则);
-
作用：返回正则匹配到的第一个字符串的位置，没有返回-1 (类似于字符串的indexOf)
var str = 'hello world'; var re1 = /o/; var re2 = /O/; console.log(str.search(re1)); // 4 console.log(str.search(re2)); // -1
3、正则的默认规则
1、区分大小写：添加修饰符 i，即可以不区分
2、只匹配成功一次，就不再匹配了，需要全部匹配，则加修符饰 g
4、转义字符
转义字符：它本来有自己的意思，加上反斜扛，就成了其它的意思了
alert('a\nb'); // n本身就是字符n的意思，加上反斜扛就成了换行
| 元字符/元符号 | 匹配情况 |
|---|---|
| . | 匹配除换行符外的任意字符 |
| [a-z0-9] | 匹配括号中的字符集中的任意字符 |
| [^a-z0-9] | 匹配任意不在括号中的字符集中的字符 |
| \d | 匹配数字 |
| \D | 匹配非数字，同0-9相同 |
| \w | 匹配字母和数字及_ |
| \W | 匹配非字母和数字及_ |
| \s | 空格 |
| \S |
非空格 |
| 元字符/元符号 | 匹配情况 |
|---|---|
| ^ | 行首匹配 |
| $ | 行尾匹配 |
| \A | 只有匹配字符串开始处 |
| \b | 匹配单词边界，词在[]内时无效 |
| \B | 匹配非单词边界 |
| \G | 匹配当前搜索的开始位置 |
| \Z | 匹配字符串结束处或行尾 |
| \z | 只匹配字符串结束处 |
| 元字符/元符号 | 匹配情况 |
|---|---|
| x? | 匹配0个或1个x |
| x* | 匹配0个或任意多个x |
| x+ | 匹配至少一个x |
| (xyz)+ | 匹配至少一个(xyz) |
| x{m,n} | 匹配最少m个、最多n个x |
| 元字符/元符号 | 匹配情况 |
|---|---|
| this|where|logo | 匹配this或where或logo中任意一个 |
| 元字符/元符号 | 匹配情况 |
|---|---|
| (string) | 用于反向引用的分组 |
| \1或$1 | 匹配第一个分组中的内容 |
| \2或$2 | 匹配第二个分组中的内容 |
| \3或$3 | 匹配第三个分组中的内容 |
| (?!pattern) | 非获取匹配，正向否定预查 |
5、正则中其它概念
1、或
-
正则里的或者：|
2、点
点：代表任意字符
真正的点：扛点
var str = 'abcd'; var re1 = /a.c/; // 任意字符 var re2 = /a.../; // 任意字符 console.log(re1.exec(str)); console.log(re2.exec(str));
3、中括号的作用
-
字符类：一组相同的元素，中括号不论写多少，都只代表一个字符
// 中括号：代表一类字符，中括号不论写多少，都只是一个字符 var str = 'abcde'; var re = /a[abcde]c/; // 可以是中括号中的任意一个字符（中括号只代表一个字符） console.log(re.test(str)); // true var re = /[0-9a-zA-Z]/; // 数字0-9 字母a-z 大写字母A-Z var re = /[a-f]/;
-
中括号中的^号 ： 排除
var re = /[^0-9]/; // 排除数字 非数字
4、大括号的作用
量词：x{m,n} x最少m个，最多n个
var re = /a{10}/; // a刚好10次 var re = /a{5,10}/; // a最少5次，最多10 var re = /a{0,1}/; // var re = /a?/; 0或1次 var re = /a{0,}/; // var re = /a*/; 0次或者多次 var re = /a{1,}/; // var re = /a+/ 一次或者多次
5、小括号的作用
分组
// 小括号：分组 var str = '2020-9-8'; var re = /(\d-)+/g; console.log(str.match(re)); // [ "0-9-" ] var str = 'ssfds454akfh34d2sklhf233'; var re = /\d+/g; console.log(str.match(re)); // [ "454", "34", "2", "233" ]
6、匹配开始和结束
| ^ | 行首匹配 |
|---|---|
| $ | 行尾匹配 |
7、正则实例
// 手机号中间四位变量 var str = '18246195158'; var re = /(\d{3})\d{4}(\d{4})/; var s = str.replace(re, function ($0, $1, $2) { // console.log($0, $1, $2); return $1 + '****' + $2; }); console.log(s); // --------------------------- var s = str.replace(re, '$1****$2'); console.log(s); // ------------------------------ // 邮编 var re = /^\d{6}$/; // 匹配中文 var re = /[\u4e00-\u9fa5]/g; // 有事一00，有酒罚我 var str = '34rew我sdfsdfdsa是你dsf北dsafdsa京sf大dsaf32423243234f爷fds'; console.log(str.match(re).join('')); // -------------------------- // email var str = '32423423@qq.com.cn'; var str = 'fds@163.com'; var re = /^\w+@[a-z0-9]+(\.[a-z]+){1,3}$/; // 网址 var str = 'https://www.baidu.com'; var re = /^[a-zA-Z]+:\/\/[^\s]+$/; // 身份证号 var re = /^[1-9]\d{14}|[1-9]\d{17}|[1-9]\d{16}x$/; // 电话号码 var re = /^0\d{2,3}-[1-9]\d{6,7}$/;
6、前瞻
-
前瞻： exp1(?=exp2) 查找后面是exp2的exp1
-
负前瞻：exp1(?!exp2) 查找后面不是exp2的exp1
// 假如我们想匹配“优就业”中的“就”，而不是其他的“就”字就需要用到前瞻后顾。 var str = '我就是我，来优就业学习'; var re = /就(?=业)/g; var s = str.replace(re, 'jiu'); console.log(s); // -------------------------- // 获取文件名 hello nodata index var path1 = 'path/hello.html'; var path2 = 'path/nodata.html'; var path3 = 'path/index.html'; var re = /\w+(?=\.html)/; console.log(path1.match(re)); console.log(path2.match(re)); console.log(path3.match(re)); // -------------------- // 负前瞻：exp1(?!exp2) 查找后面不是exp2的exp1 var str = 'a,1,b,2,c,3'; // 把字符串改成 a=1,b=2,c=3 var re = /,(?![a-z])/g; var s = str.replace(re, '='); console.log(s); // a=1,b=2,c=3
7、可视化工具
