Maison  >  Article  >  interface Web  >  Analyse d'objet RegExp en JavaScript

Analyse d'objet RegExp en JavaScript

小云云
小云云original
2018-02-09 13:39:211228parcourir

L'expression régulière (expression régulière) est une méthode d'expression de modèles de texte (c'est-à-dire des structures de chaînes), un peu comme un modèle pour les chaînes, et est souvent utilisée comme outil pour faire correspondre le texte selon un "modèle donné". Par exemple, une expression régulière donne un modèle d'adresse e-mail, puis l'utilise pour déterminer si une chaîne est une adresse e-mail. Cet article partage principalement avec vous l'analyse des objets RegExp en JavaScript.

Le système d'expressions régulières de JavaScript est basé sur Perl 5.

Il existe deux façons de créer une nouvelle expression régulière. La première consiste à utiliser des littéraux, commençant et se terminant par des barres obliques.

var regex = /xyz/;

L'autre consiste à utiliser le constructeur RegExp.

var regex = new RegExp('xyz');

Les deux façons d'écrire ci-dessus sont équivalentes, toutes deux créent un nouvel objet d'expression régulière avec le contenu xyz. La principale différence entre elles est que la première méthode crée une nouvelle expression régulière au moment de la compilation et la seconde méthode crée une nouvelle expression régulière au moment de l'exécution.

Le constructeur RegExp peut également accepter un deuxième paramètre, représentant un modificateur (explication détaillée ci-dessous).

var regex = new RegExp('xyz', "i");
// 等价于
var regex = /xyz/i;

Dans le code ci-dessus, l'expression régulière /xyz/ a un modificateur i.

Il existe une différence subtile entre ces deux manières d'écrire - les littéraux et les constructeurs - au moment de l'exécution. En utilisant la méthode d'écriture littérale, l'objet régulier est généré lorsque le code est chargé (c'est-à-dire lors de la compilation à l'aide de la méthode constructeur, l'objet régulier est généré lors de l'exécution du code) ; Compte tenu de la commodité et du caractère intuitif de l’écriture, l’écriture littérale est essentiellement utilisée dans des applications pratiques.

Une fois l'objet régulier généré, il existe deux façons de l'utiliser :

  • Méthode d'objet régulier : prendre une chaîne comme paramètre, telle que regex.test( chaîne).

  • Méthodes d'objets chaîne : prenez des objets réguliers comme paramètres, tels que string.match(regex).

Ces deux méthodes d'utilisation seront présentées ci-dessous.

Propriétés et méthodes des objets réguliers

Propriétés

Les propriétés des objets réguliers sont divisées en deux catégories.

Le premier type est lié aux modificateurs et renvoie une valeur booléenne indiquant si le modificateur correspondant est défini.

  • ignoreCase : renvoie une valeur booléenne indiquant si le modificateur i est défini. Cette propriété est en lecture seule.

  • global : renvoie une valeur booléenne indiquant si le modificateur g est défini. Cet attribut est en lecture seule.

  • multiline : renvoie une valeur booléenne indiquant si le modificateur m est défini. Cet attribut est en lecture seule.

var r = /abc/igm;
r.ignoreCase // true
r.global // true
r.multiline // true

L'autre catégorie est constituée d'attributs qui n'ont rien à voir avec les modificateurs, principalement les deux suivants.

  • lastIndex : renvoie la position où la recherche commence ensuite. Cette propriété est lisible et inscriptible, mais n'a de sens que lorsque le modificateur g est défini.

  • source : Renvoie la forme chaîne de l'expression régulière (hors barres obliques inverses), cet attribut est en lecture seule.

var r = /abc/igm;
r.lastIndex // 0
r.source // "abc"

test()

La méthode de test de l'objet régulier renvoie une valeur booléenne indiquant si le modèle actuel peut correspondre à la chaîne de paramètres.

/cat/.test('cats and dogs') // true

Le code ci-dessus vérifie si la chaîne de paramètres contient cat, et le résultat renvoie vrai.

Si l'expression régulière a le modificateur g, chaque méthode de test correspondra à l'envers à partir de la dernière position finale.

var r = /x/g;
var s = '_x_x';
r.lastIndex // 0
r.test(s) // true
r.lastIndex // 2
r.test(s) // true
r.lastIndex // 4
r.test(s) // false

L'objet régulier dans le code ci-dessus utilise le modificateur g, ce qui signifie que la position de recherche doit être enregistrée. Ensuite, utilisez la méthode de test trois fois, et la position où la recherche commence à chaque fois est la position après la correspondance précédente.

Avec le modificateur g, vous pouvez spécifier la position pour commencer la recherche via l'attribut lastIndex de l'objet normal.

var r = /x/g;
var s = '_x_x';
r.lastIndex = 4;
r.test(s) // false

Le code ci-dessus précise que la recherche commence à partir de la cinquième position de la chaîne. Il n'y a aucun caractère à cette position, donc false est renvoyé.

L'attribut lastIndex n'est valide que pour la même expression régulière, donc écrire ce qui suit est erroné.

var count = 0;
while (/a/g.test('babaa')) count++;

Le code ci-dessus provoquera une boucle infinie, car chaque condition correspondante de la boucle while est une nouvelle expression régulière, ce qui fait que l'attribut lastIndex est toujours égal à 0.

Si le motif régulier est une chaîne vide, toutes les chaînes correspondent.

new RegExp('').test('abc')
// true

exec()

La méthode exec de l'objet régulier peut renvoyer des résultats correspondants. Si une correspondance est trouvée, un tableau est renvoyé dont les membres correspondent chacun à une sous-chaîne correspondant avec succès, sinon null est renvoyé.

var s = '_x_x';
var r1 = /x/;
var r2 = /y/;
r1.exec(s) // ["x"]
r2.exec(s) // null

Dans le code ci-dessus, l'objet régulier r1 est mis en correspondance avec succès et un tableau est renvoyé, dont les membres sont les résultats correspondants ; l'objet régulier r2 ne parvient pas à correspondre et renvoie null.

Si l'expression régulière contient des parenthèses (c'est-à-dire qu'elle contient une "correspondance de groupe"), le tableau renvoyé contiendra plusieurs membres. Le premier membre est le résultat de l'ensemble de la correspondance réussie, et les membres suivants sont les groupes correspondant avec succès aux parenthèses. Autrement dit, le deuxième membre correspond à la première parenthèse, le troisième membre correspond à la deuxième parenthèse, et ainsi de suite. La propriété length de l'ensemble du tableau est égale au nombre de correspondances de groupe plus une.

var s = '_x_x';
var r = /_(x)/;
r.exec(s) // ["_x", "x"]

La méthode exec du code ci-dessus renvoie un tableau. Le premier membre est le résultat de la correspondance entière et le deuxième membre est le résultat de la correspondance entre parenthèses.

Le tableau de retour de la méthode exec contient également les deux attributs suivants :

  • input : l'intégralité de la chaîne d'origine.

  • index : La position de départ de l'ensemble du modèle correspondant avec succès (en comptant à partir de 0).

var r = /a(b+)a/;
var arr = r.exec('_abbba_aba_');
arr // ["abbba", "bbb"]
arr.index // 1
arr.input // "_abbba_aba_"

L'attribut index dans le code ci-dessus est égal à 1 car la correspondance est réussie à partir de la deuxième position de la chaîne d'origine.

如果正则表达式加上g修饰符,则可以使用多次exec方法,下一次搜索的位置从上一次匹配成功结束的位置开始。

var r = /a(b+)a/g;
var a1 = r.exec('_abbba_aba_');
a1 // ['abbba', 'bbb']
a1.index // 1
r.lastIndex // 6
var a2 = r.exec('_abbba_aba_');
a2 // ['aba', 'b']
a2.index // 7
r.lastIndex // 10
var a3 = r.exec('_abbba_aba_');
a3 // null
a3.index // TypeError: Cannot read property 'index' of null
r.lastIndex // 0
var a4 = r.exec('_abbba_aba_');
a4 // ['abbba', 'bbb']
a4.index // 1
r.lastIndex // 6

上面代码连续用了四次exec方法,前三次都是从上一次匹配结束的位置向后匹配。当第三次匹配结束以后,整个字符串已经到达尾部,正则对象的lastIndex属性重置为0,意味着第四次匹配将从头开始。

利用g修饰符允许多次匹配的特点,可以用一个循环完成全部匹配。

var r = /a(b+)a/g;
var s = '_abbba_aba_';
while(true) {
 var match = r.exec(s);
 if (!match) break;
 console.log(match[1]);
}
// bbb
// b

正则对象的lastIndex属性不仅可读,还可写。一旦手动设置了lastIndex的值,就会从指定位置开始匹配。但是,这只在设置了g修饰符的情况下,才会有效。

var r = /a/;
r.lastIndex = 7; // 无效
var match = r.exec('xaxa');
match.index // 1
r.lastIndex // 7

上面代码设置了lastIndex属性,但是因为正则表达式没有g修饰符,所以是无效的。每次匹配都是从字符串的头部开始。

如果有g修饰符,lastIndex属性就会生效。

var r = /a/g;
r.lastIndex = 2;
var match = r.exec('xaxa');
match.index // 3
r.lastIndex // 4

上面代码中,lastIndex属性指定从字符的第三个位置开始匹配。成功后,下一次匹配就是从第五个位置开始。

如果正则对象是一个空字符串,则exec方法会匹配成功,但返回的也是空字符串。

var r1 = new RegExp('');
var a1 = r1.exec('abc');
a1 // ['']
a1.index // 0
r1.lastIndex // 0
var r2 = new RegExp('()');
var a2 = r2.exec('abc');
a2 // ['', '']
a2.index // 0
r2.lastIndex // 0

字符串对象的方法

字符串对象的方法之中,有4种与正则对象有关。

  • match():返回一个数组,成员是所有匹配的子字符串。

  • search():按照给定的正则表达式进行搜索,返回一个整数,表示匹配开始的位置。

  • replace():按照给定的正则表达式进行替换,返回替换后的字符串。

  • split():按照给定规则进行字符串分割,返回一个数组,包含分割后的各个成员。

下面逐一介绍。

String.prototype.match()

字符串对象的match方法对字符串进行正则匹配,返回匹配结果。

var s = '_x_x';
var r1 = /x/;
var r2 = /y/;
s.match(r1) // ["x"]
s.match(r2) // null

从上面代码可以看到,字符串的match方法与正则对象的exec方法非常类似:匹配成功返回一个数组,匹配失败返回null。

如果正则表达式带有g修饰符,则该方法与正则对象的exec方法行为不同,会一次性返回所有匹配成功的结果。

var s = 'abba';
var r = /a/g;
s.match(r) // ["a", "a"]
r.exec(s) // ["a"]

设置正则表达式的lastIndex属性,对match方法无效,匹配总是从字符串的第一个字符开始。

var r = /a|b/g;
r.lastIndex = 7;
'xaxb'.match(r) // ['a', 'b']
r.lastIndex // 0

上面代码表示,设置lastIndex属性是无效的。

String.prototype.search()

字符串对象的search方法,返回第一个满足条件的匹配结果在整个字符串中的位置。如果没有任何匹配,则返回-1。

'_x_x'.search(/x/)
// 1

上面代码中,第一个匹配结果出现在字符串的1号位置。

该方法会忽略g修饰符。

var r = /x/g;
r.lastIndex = 2; // 无效
'_x_x'.search(r) // 1

上面代码中,正则表达式使用g修饰符之后,使用lastIndex属性指定开始匹配的位置,结果无效,还是从字符串的第一个字符开始匹配。

String.prototype.replace()

字符串对象的replace方法可以替换匹配的值。它接受两个参数,第一个是搜索模式,第二个是替换的内容。

str.replace(search, replacement)

搜索模式如果不加g修饰符,就替换第一个匹配成功的值,否则替换所有匹配成功的值。

'aaa'.replace('a', 'b') // "baa"
'aaa'.replace(/a/, 'b') // "baa"
'aaa'.replace(/a/g, 'b') // "bbb"

上面代码中,最后一个正则表达式使用了g修饰符,导致所有的b都被替换掉了。

replace方法的一个应用,就是消除字符串首尾两端的空格。

var str = ' #id p.class ';
str.replace(/^\s+|\s+$/g, '')
// "#id p.class"

replace方法的第二个参数可以使用美元符号$,用来指代所替换的内容。

  • $& 指代匹配的子字符串。

  • $` 指代匹配结果前面的文本。

  • $' 指代匹配结果后面的文本。

  • $n 指代匹配成功的第n组内容,n是从1开始的自然数。

  • $$ 指代美元符号$。


'hello world'.replace(/(\w+)\s(\w+)/, '$2 $1')
// "world hello"
'abc'.replace('b', '[$`-$&-$\']')
// "a[a-b-c]c"

replace方法的第二个参数还可以是一个函数,将每一个匹配内容替换为函数返回值。

'3 and 5'.replace(/[0-9]+/g, function(match){
 return 2 * match;
})
// "6 and 10"
var a = 'The quick brown fox jumped over the lazy dog.';
var pattern = /quick|brown|lazy/ig;
a.replace(pattern, function replacer(match) {
 return match.toUpperCase();
});
// The QUICK BROWN fox jumped over the LAZY dog.

作为replace方法第二个参数的替换函数,可以接受多个参数。第一个参数是捕捉到的内容,第二个参数是捕捉到的组匹配(有多少个组匹配,就有多少个对应的参数)。此外,最后还可以添加两个参数,倒数第二个参数是捕捉到的内容在整个字符串中的位置(比如从第五个位置开始),最后一个参数是原字符串。下面是一个网页模板替换的例子。

var prices = {
 'pr_1': '$1.99',
 'pr_2': '$9.99',
 'pr_3': '$5.00'
};
var template = '/* ... */'; // 这里可以放网页模块字符串
template.replace(
 /(<span id=")(.*?)(">)(<\/span>)/g,
 function(match, $1, $2, $3, $4){
 return $1 + $2 + $3 + prices[$2] + $4;
 }
);

上面代码的捕捉模式中,有四个括号,所以会产生四个组匹配,在匹配函数中用$1到$4表示。匹配函数的作用是将价格插入模板中。

String.prototype.split()

字符串对象的split方法按照正则规则分割字符串,返回一个由分割后的各个部分组成的数组。

str.split(separator, [limit])

该方法接受两个参数,第一个参数是分隔规则,第二个参数是返回数组的最大成员数。

// 非正则分隔
'a, b,c, d'.split(',')
// [ 'a', ' b', 'c', ' d' ]
// 正则分隔,去除多余的空格
'a, b,c, d'.split(/, */)
// [ 'a', 'b', 'c', 'd' ]
// 指定返回数组的最大成员
'a, b,c, d'.split(/, */, 2)
[ 'a', 'b' ]

上面代码使用正则表达式,去除了子字符串的逗号后面的空格。

// 例一
'aaa*a*'.split(/a*/)
// [ '', '*', '*' ]
// 例二
'aaa**a*'.split(/a*/)
// ["", "*", "*", "*"]

上面代码的分割规则是0次或多次的a,由于正则默认是贪婪匹配,所以例一的第一个分隔符是aaa,第二个分割符是a,将字符串分成三个部分,包含开始处的空字符串。例二的第一个分隔符是aaa,第二个分隔符是0个a(即空字符),第三个分隔符是a,所以将字符串分成四个部分。

如果正则表达式带有括号,则括号匹配的部分也会作为数组成员返回。

'aaa*a*'.split(/(a*)/)
// [ '', 'aaa', '*', 'a', '*' ]

上面代码的正则表达式使用了括号,第一个组匹配是“aaa”,第二个组匹配是“a”,它们都作为数组成员返回。

匹配规则

正则表达式对字符串的匹配有很复杂的规则。下面一一介绍这些规则。

字面量字符和元字符

大部分字符在正则表达式中,就是字面的含义,比如/a/匹配a,/b/匹配b。如果在正则表达式之中,某个字符只表示它字面的含义(就像前面的a和b),那么它们就叫做“字面量字符”(literal characters)。

/dog/.test("old dog") // true

上面代码中正则表达式的dog,就是字面量字符,所以/dog/匹配“old dog”,因为它就表示“d”、“o”、“g”三个字母连在一起。

除了字面量字符以外,还有一部分字符有特殊含义,不代表字面的意思。它们叫做“元字符”(metacharacters),主要有以下几个。

(1)点字符(.)

点字符(.)匹配除回车(\r)、换行(\n) 、行分隔符(\u2028)和段分隔符(\u2029)以外的所有字符。

/c.t/

上面代码中,c.t匹配c和t之间包含任意一个字符的情况,只要这三个字符在同一行,比如cat、c2t、c-t等等,但是不匹配coot。

(2)位置字符

位置字符用来提示字符所处的位置,主要有两个字符。

  • ^ 表示字符串的开始位置

  • $ 表示字符串的结束位置

// test必须出现在开始位置
/^test/.test('test123') // true
// test必须出现在结束位置
/test$/.test('new test') // true
// 从开始位置到结束位置只有test
/^test$/.test('test') // true
/^test$/.test('test test') // false

(3)选择符(|)

竖线符号(|)在正则表达式中表示“或关系”(OR),即cat|dog表示匹配cat或dog。

/11|22/.test('911') // true

上面代码中,正则表达式指定必须匹配11或22。

多个选择符可以联合使用。

// 匹配fred、barney、betty之中的一个
/fred|barney|betty/

选择符会包括它前后的多个字符,比如/ab|cd/指的是匹配ab或者cd,而不是指匹配b或者c。如果想修改这个行为,可以使用圆括号。

/a( |\t)b/.test('a\tb') // true

上面代码指的是,a和b之间有一个空格或者一个制表符。

其他的元字符还包括\\、\*、+、?、()、[]、{}等,将在下文解释。

转义符

正则表达式中那些有特殊含义的字符,如果要匹配它们本身,就需要在它们前面要加上反斜杠。比如要匹配加号,就要写成\+。

/1+1/.test('1+1')
// false
/1\+1/.test('1+1')
// true

上面代码中,第一个正则表达式直接用加号匹配,结果加号解释成量词,导致不匹配。第二个正则表达式使用反斜杠对加号转义,就能匹配成功。

正则模式中,需要用斜杠转义的,一共有12个字符:^、.、[、$、(、)、|、*、+、?、{和\\。需要特别注意的是,如果使用RegExp方法生成正则对象,转义需要使用两个斜杠,因为字符串内部会先转义一次。

(new RegExp('1\+1')).test('1+1')
// false
(new RegExp('1\\+1')).test('1+1')
// true

上面代码中,RegExp作为构造函数,参数是一个字符串。但是,在字符串内部,反斜杠也是转义字符,所以它会先被反斜杠转义一次,然后再被正则表达式转义一次,因此需要两个反斜杠转义。

特殊字符

正则表达式对一些不能打印的特殊字符,提供了表达方法。

  • \cX 表示Ctrl-[X],其中的X是A-Z之中任一个英文字母,用来匹配控制字符。

  • [\b] 匹配退格键(U+0008),不要与\b混淆。

  • \n 匹配换行键。

  • \r 匹配回车键。

  • \t 匹配制表符tab(U+0009)。

  • \v 匹配垂直制表符(U+000B)。

  • \f 匹配换页符(U+000C)。

  • \0 匹配null字符(U+0000)。

  • \xhh 匹配一个以两位十六进制数(\x00-\xFF)表示的字符。

  • \uhhhh 匹配一个以四位十六进制数(\u0000-\uFFFF)表示的unicode字符。

字符类

字符类(class)表示有一系列字符可供选择,只要匹配其中一个就可以了。所有可供选择的字符都放在方括号内,比如[xyz] 表示x、y、z之中任选一个匹配。

/[abc]/.test('hello world') // false
/[abc]/.test('') // true

上面代码表示,字符串“hello world”不包含a、b、c这三个字母中的任一个,而字符串“”包含字母a。

有两个字符在字符类中有特殊含义。

(1)脱字符(^)

如果方括号内的第一个字符是[^],则表示除了字符类之中的字符,其他字符都可以匹配。比如,[^xyz]表示除了x、y、z之外都可以匹配。

/[^abc]/.test('hello world') // true
/[^abc]/.test('bbc') // false

上面代码表示,字符串“hello world”不包含字母a、b、c中的任一个,所以返回true;字符串“bbc”不包含a、b、c以外的字母,所以返回false。

如果方括号内没有其他字符,即只有[^],就表示匹配一切字符,其中包括换行符,而点号(.)是不包括换行符的。

var s = 'Please yes\nmake my day!';
s.match(/yes.*day/) // null
s.match(/yes[^]*day/) // [ 'yes\nmake my day']

上面代码中,字符串s含有一个换行符,点号不包括换行符,所以第一个正则表达式匹配失败;第二个正则表达式[^]包含一切字符,所以匹配成功。

注意,脱字符只有在字符类的第一个位置才有特殊含义,否则就是字面含义。

(2)连字符(-)

某些情况下,对于连续序列的字符,连字符(-)用来提供简写形式,表示字符的连续范围。比如,[abc]可以写成[a-c],[0123456789]可以写成[0-9],同理[A-Z]表示26个大写字母。

/a-z/.test('b') // false
/[a-z]/.test('b') // true

上面代码中,当连字号(dash)不出现在方括号之中,就不具备简写的作用,只代表字面的含义,所以不匹配字符b。只有当连字号用在方括号之中,才表示连续的字符序列。

以下都是合法的字符类简写形式。

[0-9.,]
[0-9a-fA-F]
[a-zA-Z0-9-]
[1-31]

上面代码中最后一个字符类[1-31],不代表1到31,只代表1到3。

注意,字符类的连字符必须在头尾两个字符中间,才有特殊含义,否则就是字面含义。比如,[-9]就表示匹配连字符和9,而不是匹配0到9。

连字符还可以用来指定Unicode字符的范围。

var str = "\u0130\u0131\u0132";
/[\u0128-\uFFFF]/.test(str)
// true

另外,不要过分使用连字符,设定一个很大的范围,否则很可能选中意料之外的字符。最典型的例子就是[A-z],表面上它是选中从大写的A到小写的z之间52个字母,但是由于在ASCII编码之中,大写字母与小写字母之间还有其他字符,结果就会出现意料之外的结果。

/[A-z]/.test('\\') // true

上面代码中,由于反斜杠(\\)的ASCII码在大写字母与小写字母之间,结果会被选中。

预定义模式

预定义模式指的是某些常见模式的简写方式。

  • \d 匹配0-9之间的任一数字,相当于[0-9]。

  • \D 匹配所有0-9以外的字符,相当于[^0-9]。

  • \w 匹配任意的字母、数字和下划线,相当于[A-Za-z0-9_]。

  • \W 除所有字母、数字和下划线以外的字符,相当于[^A-Za-z0-9_]。

  • \s 匹配空格(包括制表符、空格符、断行符等),相等于[\t\r\n\v\f]。

  • \S 匹配非空格的字符,相当于[^\t\r\n\v\f]。

  • \b 匹配词的边界。

  • \B 匹配非词边界,即在词的内部。

下面是一些例子。

// \s的例子
/\s\w*/.exec('hello world') // [" world"]
// \b的例子
/\bworld/.test('hello world') // true
/\bworld/.test('hello-world') // true
/\bworld/.test('helloworld') // false
// \B的例子
/\Bworld/.test('hello-world') // false
/\Bworld/.test('helloworld') // true

上面代码中,\s表示空格,所以匹配结果会包括空格。\b表示词的边界,所以“world”的词首必须独立(词尾是否独立未指定),才会匹配。同理,\B表示非词的边界,只有“world”的词首不独立,才会匹配。

通常,正则表达式遇到换行符(\n)就会停止匹配。

var html = "<b>Hello</b>\n<i>world!</i>";
/.*/.exec(html)[0]
// "<b>Hello</b>"

上面代码中,字符串html包含一个换行符,结果点字符(.)不匹配换行符,导致匹配结果可能不符合原意。这时使用\s字符类,就能包括换行符。

var html = "<b>Hello</b>\n<i>world!</i>";
/[\S\s]*/.exec(html)[0]
// "<b>Hello</b>\n<i>world!</i>"
// 另一种写法(用到了非捕获组)
/(?:.|\s)*/.exec(html)[0]
// "<b>Hello</b>\n<i>world!</i>"

上面代码中,[\S\s]指代一切字符。

重复类

模式的精确匹配次数,使用大括号({})表示。{n}表示恰好重复n次,{n,}表示至少重复n次,{n,m}表示重复不少于n次,不多于m次。

/lo{2}k/.test('look') // true
/lo{2,5}k/.test('looook') // true

上面代码中,第一个模式指定o连续出现2次,第二个模式指定o连续出现2次到5次之间。

量词符

量词符用来设定某个模式出现的次数。

  • ? 问号表示某个模式出现0次或1次,等同于{0, 1}。

  • * 星号表示某个模式出现0次或多次,等同于{0,}。

  • + 加号表示某个模式出现1次或多次,等同于{1,}。

// t出现0次或1次
/t?est/.test('test') // true
/t?est/.test('est') // true
// t出现1次或多次
/t+est/.test('test") // true
/t+est/.test('ttest') // true
/t+est/.test('est') // false
// t出现0次或多次
/t*est/.test('test') // true
/t*est/.test('ttest') // true
/t*est/.test('tttest') // true
/t*est/.test('est') // true

贪婪模式

上一小节的三个量词符,默认情况下都是最大可能匹配,即匹配直到下一个字符不满足匹配规则为止。这被称为贪婪模式。

var s = 'aaa';
s.match(/a+/) // ["aaa"]

上面代码中,模式是/a+/,表示匹配1个a或多个a,那么到底会匹配几个a呢?因为默认是贪婪模式,会一直匹配到字符a不出现为止,所以匹配结果是3个a。

如果想将贪婪模式改为非贪婪模式,可以在量词符后面加一个问号。

var s = 'aaa';
s.match(/a+?/) // ["a"]

上面代码中,模式结尾添加了一个问号/a+?/,这时就改为非贪婪模式,一旦条件满足,就不再往下匹配。

除了非贪婪模式的加号,还有非贪婪模式的星号(*)。

  • *?:表示某个模式出现0次或多次,匹配时采用非贪婪模式。

  • +?:表示某个模式出现1次或多次,匹配时采用非贪婪模式。

修饰符

修饰符(modifier)表示模式的附加规则,放在正则模式的最尾部。

修饰符可以单个使用,也可以多个一起使用。

// 单个修饰符
var regex = /test/i;
// 多个修饰符
var regex = /test/ig;

(1)g修饰符

默认情况下,第一次匹配成功后,正则对象就停止向下匹配了。g修饰符表示全局匹配(global),加上它以后,正则对象将匹配全部符合条件的结果,主要用于搜索和替换。

var regex = /b/;
var str = 'abba';
regex.test(str); // true
regex.test(str); // true
regex.test(str); // true

上面代码中,正则模式不含g修饰符,每次都是从字符串头部开始匹配。所以,连续做了三次匹配,都返回true。

var regex = /b/g;
var str = 'abba';
regex.test(str); // true
regex.test(str); // true
regex.test(str); // false

上面代码中,正则模式含有g修饰符,每次都是从上一次匹配成功处,开始向后匹配。因为字符串“abba”只有两个“b”,所以前两次匹配结果为true,第三次匹配结果为false。

(2)i修饰符

默认情况下,正则对象区分字母的大小写,加上i修饰符以后表示忽略大小写(ignorecase)。

/abc/.test('ABC') // false
/abc/i.test('ABC') // true

上面代码表示,加了i修饰符以后,不考虑大小写,所以模式abc匹配字符串ABC。

(3)m修饰符

m修饰符表示多行模式(multiline),会修改^和$的行为。默认情况下(即不加m修饰符时),^和$匹配字符串的开始处和结尾处,加上m修饰符以后,^和$还会匹配行首和行尾,即^和$会识别换行符(\n)。

/world$/.test('hello world\n') // false
/world$/m.test('hello world\n') // true

上面的代码中,字符串结尾处有一个换行符。如果不加m修饰符,匹配不成功,因为字符串的结尾不是“world”;加上以后,$可以匹配行尾。

/^b/m.test('a\nb') // true

上面代码要求匹配行首的b,如果不加m修饰符,就相当于b只能处在字符串的开始处。

组匹配

(1)概述

正则表达式的括号表示分组匹配,括号中的模式可以用来匹配分组的内容。

/fred+/.test('fredd') // true
/(fred)+/.test('fredfred') // true

上面代码中,第一个模式没有括号,结果+只表示重复字母d,第二个模式有括号,结果+就表示匹配“fred”这个词。

下面是另外一个分组捕获的例子。

var m = 'abcabc'.match(/(.)b(.)/);
m
// ['abc', 'a', 'c']

上面代码中,正则表达式/(.)b(.)/一共使用两个括号,第一个括号捕获a,第二个括号捕获c。

注意,使用组匹配时,不宜同时使用g修饰符,否则match方法不会捕获分组的内容。

var m = 'abcabc'.match(/(.)b(.)/g);
m
// ['abc', 'abc']

上面代码使用带g修饰符的正则表达式,结果match方法只捕获了匹配整个表达式的部分。

在正则表达式内部,可以用\n引用括号匹配的内容,n是从1开始的自然数,表示对应顺序的括号。

/(.)b(.)\1b\2/.test("abcabc")
// true

上面的代码中,\1表示前一个括号匹配的内容(即“a”),\2表示第二个括号匹配的内容(即“b”)。

下面是另外一个例子。

/y(..)(.)\2\1/.test('yabccab') // true

括号还可以嵌套。

/y((..)\2)\1/.test('yabababab') // true

上面代码中,\1指向外层括号,\2指向内层括号。

组匹配非常有用,下面是一个匹配网页标签的例子。

var tagName = /<([^>]+)>[^<]*<\/\1>/;
tagName.exec("<b>bold</b>")[1]
// 'b'

上面代码中,圆括号匹配尖括号之中的标签,而\1就表示对应的闭合标签。

上面代码略加修改,就能捕获带有属性的标签。

var html = '<b class="hello">Hello</b><i>world</i>';
var tag = /<(\w+)([^>]*)>(.*?)<\/\1>/g;
var match = tag.exec(html);
match[1] // "b"
match[2] // "class="hello""
match[3] // "Hello"
match = tag.exec(html);
match[1] // "i"
match[2] // ""
match[3] // "world"

(2)非捕获组

(?:x)称为非捕获组(Non-capturing group),表示不返回该组匹配的内容,即匹配的结果中不计入这个括号。

非捕获组的作用请考虑这样一个场景,假定需要匹配foo或者foofoo,正则表达式就应该写成/(foo){1, 2}/,但是这样会占用一个组匹配。这时,就可以使用非捕获组,将正则表达式改为/(?:foo){1, 2}/,它的作用与前一个正则是一样的,但是不会单独输出括号内部的内容。

请看下面的例子。

var m = 'abc'.match(/(?:.)b(.)/);
m // ["abc", "c"]

上面代码中的模式,一共使用了两个括号。其中第一个括号是非捕获组,所以最后返回的结果中没有第一个括号,只有第二个括号匹配的内容。

下面是用来分解网址的正则表达式。

// 正常匹配
var url = /(http|ftp):\/\/([^/\r\n]+)(\/[^\r\n]*)?/;
url.exec('http://google.com/');
// ["http://google.com/", "http", "google.com", "/"]
// 非捕获组匹配
var url = /(?:http|ftp):\/\/([^/\r\n]+)(\/[^\r\n]*)?/;
url.exec('http://google.com/');
// ["http://google.com/", "google.com", "/"]

上面的代码中,前一个正则表达式是正常匹配,第一个括号返回网络协议;后一个正则表达式是非捕获匹配,返回结果中不包括网络协议。

(3)先行断言

x(?=y)称为先行断言(Positive look-ahead),x只有在y前面才匹配,y不会被计入返回结果。比如,要匹配后面跟着百分号的数字,可以写成/\d+(?=%)/。

“先行断言”中,括号里的部分是不会返回的。

var m = 'abc'.match(/b(?=c)/);
m // ["b"]

上面的代码使用了先行断言,b在c前面所以被匹配,但是括号对应的c不会被返回。

再看一个例子。

/Jack (?=Sprat|Frost)/.test('Jack Frost') // true

(4)先行否定断言

x(?!y)称为先行否定断言(Negative look-ahead),x只有不在y前面才匹配,y不会被计入返回结果。比如,要匹配后面跟的不是百分号的数字,就要写成/\d+(?!%)/。

/\d+(?!\.)/.exec('3.14')
// ["14"]

上面代码中,正则表达式指定,只有不在小数点前面的数字才会被匹配,因此返回的结果就是14。

“先行否定断言”中,括号里的部分是不会返回的。

var m = 'abd'.match(/b(?!c)/);
m // ['b']

上面的代码使用了先行否定断言,b不在c前面所以被匹配,而且括号对应的d不会被返回。

参考链接

Axel Rauschmayer, JavaScript: an overview of the regular expression API

Mozilla Developer Network, Regular Expressions

Axel Rauschmayer, The flag /g of JavaScript's regular expressions

Sam Hughes, Learn regular expressions in about 55 minutes

相关推荐:

关于MySQL中REGEXP正则表达式使用小结

详谈MYSQL模式匹配REGEXP和like的代码用法分享

MySQL中使用replace、regexp进行正则表达式替换的用法分析

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn