Comment utiliser les expressions régulières en Javascript

Les expressions régulières peuvent être un ensemble de caractères incompréhensibles dans l'esprit des gens, mais ce sont ces symboles qui permettent des opérations efficaces sur les chaînes. L'expression régulière (expression régulière) est une spécification grammaticale d'un langage simple. Il s'agit d'un outil de traitement de texte puissant, pratique et efficace. Il est utilisé dans certaines méthodes pour implémenter des opérations de recherche, de remplacement et d'extraction d'informations dans des chaînes. le problème en lui-même n'est pas compliqué, mais sans expressions régulières, cela devient un gros problème. Les expressions régulières en JavaScript sont des connaissances très importantes. Cet article présentera la syntaxe de base des expressions régulières.

Définition

L'expression régulière (expression régulière) est une spécification grammaticale d'un langage simple. C'est un outil de traitement de texte puissant, pratique et efficace. Il est utilisé dans certaines méthodes pour traiter des chaînes. Les informations dans réalisent des opérations de recherche, de remplacement et d'extraction

Les expressions régulières en JavaScript sont représentées par des objets RegExp. Il existe deux manières d'écrire : l'une est l'écriture littérale ; l'autre est l'écriture de constructeur

Régulier. les expressions sont particulièrement utiles pour traiter des chaînes. Il existe de nombreux endroits où les expressions régulières peuvent être utilisées en JavaScript. Cet article résume les connaissances de base des expressions régulières et l'utilisation des expressions régulières en JavaScript.

La première partie répertorie brièvement les scénarios d'utilisation des expressions régulières en JavaScript ; la deuxième partie présente en détail les connaissances de base des expressions régulières et écrit quelques exemples pour une compréhension facile.

Le contenu de cet article est mon propre résumé après avoir lu la méthode d'écriture des expressions régulières et le chapitre sur les expressions régulières js dans le livre de Rhino, le contenu peut donc contenir des omissions et des imprécisions. Si des experts passent par là et trouvent des erreurs dans l’article, veuillez les corriger !

L'utilisation d'expressions régulières en Javascript

Une expression régulière peut être considérée comme une description caractéristique d'un fragment de caractère, et sa fonction est de découvrir les conditions qui satisfont la condition à partir d'un tas de chaînes sous-chaîne. Par exemple, si je définis une expression régulière en JavaScript :

var reg=/hello/  或者 var reg=new RegExp("hello")

, alors cette expression régulière peut être utilisée pour trouver le mot bonjour à partir d'un tas de chaînes. Le résultat de l'action "trouver" peut être de trouver la position du premier bonjour, de remplacer bonjour par une autre chaîne, de trouver tous les bonjour, etc. Vous trouverez ci-dessous une liste de fonctions pouvant utiliser des expressions régulières en JavaScript, et une brève introduction aux fonctions de ces fonctions sera introduite dans la deuxième partie.

La méthode String.prototype.search

est utilisée pour trouver l'index de la première occurrence d'une certaine sous-chaîne dans la chaîne d'origine. Sinon, elle renvoie -1

.

"abchello".search(/hello/); // 3

La méthode String.prototype.replace

est utilisée pour remplacer les sous-chaînes dans la chaîne

"abchello".replace(/hello/,"hi");  // "abchi"

String.prototype La méthode .split

est utilisée pour diviser la chaîne

"abchelloasdasdhelloasd".split(/hello/); //["abc", "asdasd", "asd"]

Méthode String.prototype.match

est utilisé pour capturer des sous-chaînes d'une chaîne dans un tableau. Par défaut, un seul résultat est capturé dans le tableau. Lorsque l'expression régulière a l'attribut "global capture" (ajoutez le paramètre g lors de la définition de l'expression régulière), tous les résultats seront capturés dans le tableau

"abchelloasdasdhelloasd".match(/hello/); //["hello"]
"abchelloasdasdhelloasd".match(/hello/g); //["hello","hello"]

Les performances de la méthode match sont différentes, que l'expression régulière utilisée comme paramètre de correspondance ait ou non des attributs globaux, qui seront discutés plus tard dans le regroupement des expressions régulières.

La méthode RegExp.prototype.test

est utilisée pour tester si la chaîne contient des sous-chaînes

/hello/.test("abchello"); // true

RegExp.prototype Le . La méthode exec

est similaire à la méthode de correspondance d'une chaîne. Cette méthode capture également les chaînes qui remplissent les conditions de la chaîne dans un tableau, mais il existe deux différences.

1. La méthode exec ne peut capturer qu'une seule sous-chaîne dans un tableau à la fois, que l'expression régulière ait ou non des attributs globaux

var reg=/hello/g;
reg.exec("abchelloasdasdhelloasd");  // ["hello"]

2. L'objet d'expression régulière (c'est-à-dire l'objet RegExp en JavaScript) a un attribut lastIndex, qui est utilisé pour indiquer où commencer la capture la prochaine fois. Après chaque exécution de la méthode exec, le lastIndex sera repoussé jusqu'à ce qu'il n'y ait plus de correspondance. Le caractère est trouvé. Renvoyez null et recommencez la capture depuis le début. Cette propriété peut être utilisée pour parcourir les sous-chaînes dans une chaîne capturée.

var reg=/hello/g;
reg.lastIndex; //0
reg.exec("abchelloasdasdhelloasd"); // ["hello"]
reg.lastIndex; //8
reg.exec("abchelloasdasdhelloasd"); // ["hello"]
reg.lastIndex; //19
reg.exec("abchelloasdasdhelloasd"); // null
reg.lastIndex; //0

Bases des expressions régulières

Métacaractères

La première section ci-dessus utilise /hello/ comme exemple, mais des applications pratiques Vous pouvez rencontrer de telles exigences : faire correspondre une chaîne de nombres incertains, faire correspondre la position de départ, faire correspondre la position de fin et faire correspondre les caractères d'espacement. C'est là que les métacaractères peuvent être utilisés.

Métacaractère :

//匹配数字: \d
"ad3ad2ad".match(/\d/g); // ["3", "2"]
//匹配除换行符以外的任意字符: .
"a\nb\rc".match(/./g); // ["a", "b", "c"]
//匹配字母或数字或下划线 ： \w
"a5_ 汉字@!-=".match(/\w/g); // ["a", "5", "_"]
//匹配空白符:\s
"\n \r".match(/\s/g); //[" ", " ", ""] 第一个结果是\n，最后一个结果是\r
//匹配【单词开始或结束】的位置 ： \b
"how are you".match(/\b\w/g); //["h", "a", "y"] 
// 匹配【字符串开始和结束】的位置: 开始 ^ 结束 $
"how are you".match(/^\w/g); // ["h"]

Métacaractère d'antonyme, écrit en changeant les lettres minuscules ci-dessus en majuscules, par exemple, correspond à tout ce qui n'est pas un nombre Caractères : D

Il existe également quelques métacaractères utilisés pour représenter les répétitions, qui seront introduits dans le contenu suivant.

Plage de caractères

Utilisez le symbole - dans [] pour représenter une plage de caractères. Tels que :

// 匹配字母 a-z 之间所有字母
/[a-z]/
// 匹配Unicode中 数字 0 到 字母 z 之间的所有字符
/[0-z]/ 
// unicode编码查询地址：
//https://en.wikibooks.org/wiki/Unicode/Character_reference/0000-0FFF
//根据上面的内容，我们可以找出汉字的Unicode编码范围是 \u4E00 到 \u9FA5，所以我们可以写一个正则表达式来判断一个字符串中是否有汉字
/[\u4E00-\u9FA5]/.test("测试"); // true

Répétition & cupidité et paresse

Tout d'abord, parlons de répétition Lorsque nous voulons faire correspondre certains caractères répétés, nous devons l'utiliser Certaines expressions régulières liées à la répétition s'écrivent comme suit :

//重复n次 {n}
"test12".match(/test\d{3}/); // null
"test123".match(/test\d{3}/); // ["test123"]
//重复n次或更多次 {n,}
"test123".match(/test\d{3,}/); // ["test123"]
//重复n到m次
"test12".match(/test\d{3,5}/); // null
"test12345".match(/test\d{3,5}/); // ["test12345"]
"test12345678".match(/test\d{3,5}/); // ["test12345"]
// 匹配字符test后边跟着数字，数字重复0次或多次
"test".match(/test\d*/); // ["test"]
"test123".match(/test\d*/); // ["test123"]
//重复一次或多次
"test".match(/test\d+/) ; // null
"test1".match(/test\d*/); //["test1"]
//重复一次或0次
"test".match(/test\d?/) ; // null
"test1".match(/test\d?/); //["test1"]

Comme vous pouvez le voir à partir des résultats ci-dessus, le nombre qui suit le test de caractère peut être répété 0 fois ou plus Quand, la sous-chaîne capturée par l'expression régulière renverra autant de nombres que possible. Par exemple, si /testd*/ correspond à test123, test123 sera renvoyé à la place de test ou test12.

正则表达式捕获字符串时，在满足条件的情况下捕获尽可能多的字符串，这就是所谓的“贪婪模式”。

对应的”懒惰模式“，就是在满足条件的情况下捕获尽可能少的字符串，使用懒惰模式的方法，就是在字符重复标识后面加上一个 "?"，写法如下

// 数字重复3~5次，满足条件的情况下返回尽可能少的数字
"test12345".match(/test\d{3,5}?/); //["test123"]
// 数字重复1次或更多，满足条件的情况下只返回一个数字
"test12345".match(/test\d+?/); // ["test1"]

字符转义

在正则表达式中元字符是有特殊的含义的，当我们要匹配元字符本身时，就需要用到字符转义，比如：

/\./.test("."); // true

分组 & 分支条件

正则表达式可以用 " ()  " 来进行分组，具有分组的正则表达式除了正则表达式整体会匹配子字符串外，分组中的正则表达式片段也会匹配字符串。

分组按照嵌套关系和前后关系，每个分组会分配得到一个数字组号，在一些场景中可以用组号来使用分组。

在 replace、match、exec函数中，分组都能体现不同的功能。

replace函数中，第二个参数里边可以用 $+数字组号来指代第几个分组的内容，如：

" the best language in the world is java ".replace(/(java)/,"$1script"); // " the best language in the world is javascript "
"/static/app1/js/index.js".replace(/(\/\w+)\.js/,"$1-v0.0.1.js"); //"/static/app1/js/index-v0.0.1.js"    (\/\w+)分组匹配的就是 /index ，

在第二个参数中为其添加上版本号

match函数中，当正则表达式有全局属性时，会捕获所有满足正则表达式的子字符串

"abchellodefhellog".match(/h(ell)o/g); //["hello", "hello"]

但是当正则表达式没有全局属性，且正则表达式中有分组的时候，match函数只会返回整个正则表达式匹配的第一个结果，同时会将分组匹配到的字符串也放入结果数组中：

"abchellodefhellog".match(/h(ell)o/); //["hello", "ell"]
// 我们可以用match函数来分解url，获取协议、host、path、查询字符串等信息
"http://www.baidu.com/test?t=5".match(/^((\w+):\/\/([\w\.]+))\/([^?]+)\?(\S+)$/);
// ["http://www.baidu.com/test?t=5", "http://www.baidu.com", "http", "www.baidu.com", "test", "t=5"]

exec函数在正则表达式中有分组的情况下，表现和match函数很像，只是无论正则表达式是否有全局属性，exec函数都只返回一个结果，并捕获分组的结果

/h(ell)o/g.exec("abchellodefhellog"); //["hello", "ell"]

当正则表达式需要匹配几种类型的结果时，可以用到分支条件，例如

"asdasd hi asdad hello asdasd".replace(/hi|hello/,"nihao"); //"asdasd nihao asdad hello asdasd"
"asdasd hi asdad hello asdasd".split(/hi|hello/); //["asdasd ", " asdad ", " asdasd"]

 注意，分支条件影响它两边的所有内容， 比如 hi|hello  匹配的是hi或者hello，而不是 hiello 或者 hhello

分组中的分支条件不会影响分组外的内容

"abc acd bbc bcd ".match(/(a|b)bc/g); //["abc", "bbc"]

后向引用

正则表达式的分组可以在其后边的语句中通过  \+数字组号来引用

比如

// 匹配重复的单词
/(\b[a-zA-Z]+\b)\s+\1/.exec(" asd sf hello hello asd"); //["hello hello", "hello"]

断言

 (?:exp) , 用此方式定义的分组，正则表达式会匹配分组中的内容，但是不再给此分组分配组号，此分组在replace、match等函数中的作用也会消失，效果如下：

/(hello)\sworld/.exec("asdadasd hello world asdasd") // ["hello world", "hello"],正常捕获结果字符串和分组字符串
/(?:hello)\sworld/.exec("asdadasd hello world asdasd") // ["hello world"]
"/static/app1/js/index.js".replace(/(\/\w+)\.js/,"$1-v0.0.1.js"); //"/static/app1/js/index-v0.0.1.js"
"/static/app1/js/index.js".replace(/(?:\/\w+)\.js/,"$1-v0.0.1.js"); //"/static/app1/js$1-v0.0.1.js"

(?=exp) 这个分组用在正则表达式的后面，用来捕获exp前面的字符，分组中的内容不会被捕获，也不分配组号

/hello\s(?=world)/.exec("asdadasd hello world asdasd") // ["hello "]

(?!exp)  和前面的断言相反，用在正则表达式的后面，捕获后面不是exp的字符，同样不捕获分组的内容，也不分配组号

/hello\s(?!world)/.exec("asdadasd hello world asdasd") //null

处理选项

javascript中正则表达式支持的正则表达式有三个，g、i、m，分别代表全局匹配、忽略大小写、多行模式。三种属性可以自由组合共存。

// 全局匹配 g 
"abchelloasdasdhelloasd".match(/hello/); //["hello"]
"abchelloasdasdhelloasd".match(/hello/g); //["hello","hello"]
//忽略大小写 i
"abchelloasdasdHelloasd".match(/hello/g); //["hello"]
"abchelloasdasdHelloasd".match(/hello/gi); //["hello","Hello"]

在默认的模式下，元字符 ^ 和 $ 分别匹配字符串的开头和结尾处，模式 m 改变了这俩元字符的定义，让他们匹配一行的开头和结尾

"aadasd\nbasdc".match(/^[a-z]+$/g); //null 字符串^和$之间有换行符，匹配不上 [a-z]+ ,故返回null
"aadasd\nbasdc".match(/^[a-z]+$/gm); // ["aadasd", "basdc"] ，改变^$的含义，让其匹配一行的开头和末尾，可以得到两行的结果

相关推荐：

Replace中的正则表达式_正则表达式

JS使用正则表达式找出最长连续子串长度

关于HTML用正则表达式检验表格方法

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!