JavaScript从入门到放弃

JavaScript 与正则表达式 -- 匹配模式

2019-01-12  本文已影响0人  菜鸟很浮夸

在正则表达式中,一般所说的匹配模式指的是匹配时遵循的规则。通过设置匹配模式,可以改变正则表达式的匹配规则。

指定方式

在很多编程语言中,可以通过模式修饰符的方式指定,形如:(?modifier),其中 modifier 为模式修饰符。
但是,JavaScript 是一个另类,不支持这种方式。
JavaScript 中可以通过标志(flag,也被称为修饰符)来指定匹配模式:

var re = /pattern/flags;
// 或者
var re = new RegExp("pattern", "flags");

不区分大小写模式

也叫大小写不敏感模式,顾名思义,正则表达式匹配时,不区分大小写。使用标志 iignoreCase)指定:

var regex = /hello/i;
console.log(regex.test('HEllo'));   // true
console.log(regex.test('HELLO'));   // true

全局模式

简单来说,就是找到所有匹配,而不是在找到第一个之后就停止。使用标志 gglobal)指定:

var regex = /hello\d/g;
var text = 'hello1 hello2';
console.log(text.match(regex));  // ["hello1", "hello2"]

值得注意的是,String.prototype.match() 方法在全局模式和非全局模式下的行为不同。
另外,RegExp.prototype.exec() 方法,在全局模式下需要多次调用来完成全部的匹配。这种情况下,查找将从正则表达式的lastIndex 属性指定的位置开始。

var regex = /hello\d/g;
console.log(regex.exec('hello1 hello2'));   // ["hello1", index: 0, input: "hello1 hello2"]
console.log(regex.lastIndex);  // 6
console.log(regex.exec('hello1 hello2'));   // ["hello2", index: 7, input: "hello1 hello2"]
console.log(regex.lastIndex);  // 13
console.log(regex.exec('hello1 hello2'));   // null
console.log(regex.lastIndex);  // 0

dotAll模式

指定点号 . 的匹配规则。在默认模式下,. 可以匹配除了换行符外的任何字符。在 dotAll 模式下,点号可以匹配包括换行符在内的任何字符。所以被称为 dotALL 模式,也叫单行模式
其实,通过 dotALL 这个名字更容易理解这个匹配模式,而单行模式这个名字,可以帮助我们记住该模式的标志:s (single line) 。

注意:dotALL模式是在 ES2017 才出现的。

var regex1 = /a.b/;
var regex2 = /a.b/s;
var text = 'a\nb';
console.log(regex1.test(text));  // false
console.log(regex2.test(text));  // true

多行模式

用来指定 ^$ 的匹配规则。在默认模式下,^$ 匹配的是整个输入字符串的开始位置和结束位置。在多行模式下,它们能匹配字符串内部每一行文本的起始位置和结束位置。使用标志 m (multiline)指定。

var regex1 = /^b$/;
var regex2 = /^b$/m;
var text = 'a\nb\nc';
console.log(regex1.test(text));  // false
console.log(regex2.test(text));  // true

Unicode模式

“Unicode 模式”,用来正确处理大于 \uffff 的 Unicode 字符。使用 ES6 新增的 u (Unicode) 标志指定。
在 ES6 之前,使用 \uxxxx 的形式表示 Unicode 码点。但是对于码点大于 \uffff 的字符会被当做两个字符处理。

在准备 Unicode 例子的过程中发现了下面这个好玩的例子:

var regex = /[𩁿]/;
var text = '👿';
console.log(regex.test(text));  // true

var regex = /[𩁿]/u;
var text = '👿';
console.log(regex.test(text));  // false

Chrome 开发者工具运行截图:

一个好玩的截图
其中,𩁿,一个很神奇的字,Unicode 码点可表示为:\ud864\udc7f ,👿表情的 Unicode 码点表示为:\ud83d\udc7f ,对于第一个的正则表达式来讲,字符组内是 [\ud83d\udc7f] 两个字符,其中 \udc7f 可以匹配👿当中的 \udc7f
对于第二个的正则表达式来说,使用 u 指定了“Unicode模式”,就可以避免这种情况。

定点模式

定点模式也是 ES6 新增内容,通过 y (ticky)标签指定。
所谓定点,就是从某个指定的位置开始匹配,这个位置就是 正则表达式的 lastIndex 属性指定的位置。
先简单看一个例子:

var regex = /hello/y;
var text = '00hello00';

console.log(regex.lastIndex);  // 0
console.log(regex.test(text));  // false
console.log(regex.lastIndex);  // 0

regex.lastIndex = 2;
console.log(regex.test(text));  // true
console.log(regex.lastIndex);  // 7

console.log(regex.test(text));  // false
console.log(regex.lastIndex);  // 0

其中:

  1. 在定点模式中,使用 lastIndex 作为唯一精确的位置来进行匹配,且匹配时不会发生向前的移动。
  2. 匹配结果,要么在 lastIndex 位置匹配成功,要么匹配失败
  3. 如果匹配成功,改变 lastIndex 的值为匹配末尾之后的位置。如果匹配失败,将 lastIndex 的值重置为0。

以上,就是定点模式主要的特点。

y^

有一种不正确的说法: 定点模式(y 标志)实际上隐含了开始位置 (锚点^)。
在非定点模式中,如果使用 ^ ,正则表达式在匹配时必须从开头位置开始匹配。而在定点模式中,其依赖的 lastIndex 默认值为 0,所以表现和 ^ 相似。但,并不表示上面的说法是正确的。
这种说法好像对于理解定点模式也没有任何帮助!尽量不去理会它吧!

yg

二者的差别很大,只有在使用 RegExp.prototype.exec() 方法时,表现有些相似,因为,全局模式中,也是从 lastIndex 开始匹配。此时二者的区别还是要从定点模式的特点说:只会匹配当前位置,并不会向前移动。

上一篇 下一篇

猜你喜欢

热点阅读