JavaScript 正则表达式--笔记

1 正则表达式字符匹配

1.创建

正则是 js 内置对象，两种方法创建。

let re01 = new RegExp('a'); // 这种形式可以往正则中传入变量
let re02 = /a/; // 简写不可以传入变量，不可以加引号

2.test 方法

以字符串为参数，字符串有符合正则的部分，返回 true，否则返回 false。

let str = 'abc';
let re = /a/;
re.test(str); // true

3.search 方法

以正则为参数，查找字符串中有符合正则的部分，有则返回第一个匹配项的位置，否则返回 -1。

let str = 'bbcasa';
let re = /a/;
str.search(re); // 4

4.match 方法

以正则为参数，寻找字符串中符合正则的匹配项，并将这些匹配项以数组形式返回，否则返回 null。

let str = 'abcaadaefaa';
let re = /a+/g; // + 表示出现一次或者更多，g 表示全局搜索
str.match(re); // ['a','aa','a','aa']

5.replace 方法

str.replace(re, newStr | callback) 该方法首先匹配字符串中符合正则的部分然后替换成newStr或者callback的返回值；这里的callback = function(str,str1,str2…){return res}，参数str表示匹配到的匹配项，str1，str2…分别表示正则匹配项中的第一个，第二个子项。

var str = "我爱吃饭，我爱睡觉，我爱打豆豆";
var re = /(吃饭)|(睡觉)|(打豆豆)/g ;
str.replace(re, (...grv) => {
    var res = [];
    res = grv[0].split("").map(() => {return "*"}).join("")
    return res
})

6.默认行为

• 正则默认区分大小写，在末尾加 i 关闭区分大小写

var re=/AbvR/i;

• 正则默认找到第一个匹配项就会结束，在末尾加 b可以使正则变为全局模式

var re=/as/b;

正则表达式可以横向模糊匹配，纵向模糊匹配

7.横向模糊匹配

使用量词，比如{m,n}，/ab{2,5}c/ 表示匹配第一个字符是“a”，后面的2到5个是“b”，然后是“c”。

var regex = /ab{2,5}c/g;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log( string.match(regex) ); 
// => ["abbc", "abbbc", "abbbbc", "ab

这里用到了 g，代表要找到所有满足条件的子串。

8.纵向模糊匹配

使用字符组，比如[abc]，代表可以是 “a”，“b”，“c” 中的任意一个。/a[123]b/ 就有可能是“a1b”，“a2b”，“a3b”。

var regex = /a[123]b/g;
var string = "a0b a1b a2b a3b a4b";
console.log( string.match(regex) ); 
// => ["a1b", "a2b", "a3b"]

9量词

9.1简写

{m,} 表示至少出现 m 次

{m} 等价于{m,m} 表示只出现 m 次

? 等价于 {0,1} 表示出现 0 次到 1 次，也就是可能出现可能不出现

+ 等价于 {1,} 表示至少出现 1 次

* 等价于 {0,} 表示出现 0 到 无数次，也就是可能不出现，可能出现任意次

9.2贪婪匹配和惰性匹配

• 贪婪匹配

var regex = /\d{2,5}/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) ); 
// => ["123", "1234", "12345", "12345"]

看这个正则代表任意数字出现 2 到 5 次，是贪婪的，会尽可能的匹配，如果给他 6 个，他会匹配其中的 5 个，在能力范围内越多越好。

• 惰性匹配

var regex = /\d{2,5}?/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) ); 
// => ["12", "12", "34", "12", "34", "12", "34", "56"]

“?” 表示虽然 2 次到 5 次都可以，但是 2 次就够了，不贪婪。量词后面加个 “?” 就是表示惰性匹配，记忆方法就是问问自己，足够了吗？

10 量词

10.1 范围表示法

如果字符组里的字符特别多，可以用范围表示，[1234abcdefGHIJKLM]，可以写成[1-4a-fG-M]，在这里 “-” 当做了一种表示范围的特殊用法，但如果想要匹配的就是 “-“，可以写成[-az]，[az-]，[a\-z]。

要么错开要么转译。

10.2 排除字符组

纵向匹配除了表示字符组中的任何一个，但也可以是除了字符组之外的任意一个，就是排除字符组。

[^abc] 表示除了“a”，“b”，“c”之外的任意字符。

10.3 常见的字符组简写

\d 是 [0-9] 记忆方法是数字的英文 digit

\D 是 [^0-9]

\w 是 [0-9a-zA-Z_] 表示数字、大小写字母和下划线

\W 是 [^0-9a-zA-Z_] 表示非单词字符

\s 是 [ \t\v\n\r\f] 表示空白符，包括空格、水平制表符、垂直制表符、换行符、回车符、换页符。记忆方法是 space character 的首字母

\S 是 [^ \t\v\n\r\f] 表示非空白符

. 是 [^\n\r\u2028\u2029] 表示通配符，几乎是任意字符（换行符、回车符、行分隔符和段分隔符除外）

如果需要匹配任意字符，使用 [\d\D]，[\w\W]，[\s\S]，[^] 中任何的一个

11 多选分支

多选分支可以支持多个子模式任选其一。

具体形式：(p1|p2|p3)，其中 p1，p2，p3 是子模式，用 “|” 管道符分割，表示任意其中之一。

比如要匹配“good”和“nice”可以用/good|nice/：

var regex = /good|nice/g;
var string = "good idea, nice try.";
console.log( string.match(regex) ); 
// => ["good", "nice"]

但需要注意用 /good|goodbye/ 去匹配“goodbye”时，结果是“good”：

var regex = /good|goodbye/g;
var string = "goodbye";
console.log( string.match(regex) ); 
// => ["good"]

而用 /goodbye|good/ 去匹配“goodbye”，结果是“goodbye”：

var regex = /goodbye|good/g;
var string = "goodbye";
console.log( string.match(regex) ); 
// => ["goodbye"]

因为分支结构也是惰性的。

2 正则表达式位置匹配

2.1 锚字符

**^**

**$**

**\b**

**\B**

**(?=p)**

**(?!p)**

2.1.1 ^ 和 $

^ 匹配开头，匹配输入的开始

$ 匹配结尾，匹配输入的结束

var result = "hello".replace(/^|$/g, '#');
console.log(result); 
// => "#hello#"

多行匹配时二者是行首和行尾的概念：

var result = "I\nlove\njavascript".replace(/^|$/gm, '#');
console.log(result);
/*
#I#
#love#
#javascript#
*/

2.1.2 \b 和 \B

\b 是单词边界，是 \w 和 \W 间的位置，也包括 \w 和 ^ 间的位置，也包括 \w 和 $ 间的位置。

var result = "[JS] Lesson_01.mp4".replace(/\b/g, '#');
console.log(result); 
// => "[#JS#] #Lesson_01#.#mp4#"

前几个#是 \w 和 \W 之间的位置，最后一个是\w 和 $ 之间的位置。

\B 就是\b 反面的意思。也就是上面结果所有不是#的地方插入#：

var result = "[JS] Lesson_01.mp4".replace(/\B/g, '#');
console.log(result); 
// => "#[J#S]# L#e#s#s#o#n#_#0#1.m#p#4"

2.1.3 (?=p) 和 (?!p)

(?=p)，p 前面的位置，p 是一个子模式。positive lookahead

比如 (?=l)，就是 “l” 字符前面的位置：

var result = "hello".replace(/(?=l)/g, '#');
console.log(result); 
// => "he#l#lo"

而 (?!p) 就是 (?=p) 的反面意思，negative lookahead：

var result = "hello".replace(/(?!l)/g, '#');
console.log(result); 
// => "#h#ell#o#"

ES6 中支持 (?<=p) positive lookbehind 和 (?

2.2 位置的特性

“位置”可以理解空字符“”，“hello”等价为：

"hello" == "" + "h" + "" + "e" + "" + "l" + "" + "l" + "o" + "";

也等价于：

"hello" == "" + "" + "hello"