js正則匹配總結(jié)

前言

js匹配是js中比較重要的一個概念,我們在工作中經(jīng)常用到,但是往往都是記得不是很清楚沼琉,或者有些遺忘茅姜,這次記錄總結(jié)一下,讓自己加深一下印象薛匪,同時也會小伙伴們提供查閱資料的地方

正則表達式語法

1:字面量形式

let reg = /\bis\b/; 
let string = 'it is a cat';
console.log(string.replace(reg, 'vvv'));

2:構(gòu)造函數(shù)實例化

let reg = new RegExp('\\bis\\b', 'g'); // 反斜線需要轉(zhuǎn)義捐川,所以是兩個\\ (轉(zhuǎn)義問題在研究)
let string = 'it is a cat';
console.log(string.replace(reg, 'vvv'));

正則表達式常見語法

1:修飾符

// 全局搜索
let reg = /\bis\b/g; 
let string = 'it is a cat, he is a boy';
console.log(string.replace(reg, 'vvv'));

// 忽略大小寫
let reg = /\bis\b/gi; 
let string = 'it is a cat, he IS a boy';
console.log(string.replace(reg, 'vvv'));

// 換行匹配
// 換行匹配意思就是讓每一行做為開頭或者結(jié)尾來匹配,所以必須要用^,$來一起用
let string = `aaan
tttt`;
let reg = /an/;
string .match(reg);

2:元字符

2.1:表示非打印字符

正則 描述
\n 匹配一個換行符
\r 匹配一個回車符
\t 匹配一個制表符
\v 匹配一個垂直制表符
\f 匹配一個換頁符
\b 匹配一個單詞邊界
\B 匹配一個非單詞邊界

2.2:表示集合和范圍

正則 描述
. 匹配任意一個非換行符
表示或者的意思
[] 同樣表示或者的意思[abc],匹配a, b ,c中任意一個
\d 匹配任意一個數(shù)字即[0-9]
\D 匹配任意一個非數(shù)字字符即[^0-9]
\s 匹配任意一個空白字符即[\f\t\r\v\n]
\S 匹配任意一個非空白字符即[^\f\t\r\n\v]
\w 匹配任意一個數(shù)字逸尖,字母古沥,下劃線即[0-9a-zA-Z_]
\W 匹配任意一個非數(shù)字,字母娇跟,下劃線即[^0-9a-zA-Z_]

2.3:表示量詞

正則 描述
* 表示匹配0次岩齿,1次,或者多次
+ 表示匹配一次或者多次
? 表示匹配0次或者1次
{n} 表示匹配n次
{n,} 表示匹配n次苞俘,或者n次以上
{n, m} 表示匹配最少n次最多m次

2.4:表示邊界控制和模式單元

正則 描述
^ 表示以什么什么開頭
$ 表示以什么什么結(jié)尾
[^] 括號里面^表示非盹沈,[^0-9]表示匹配不是0-9的字符
() 模式匹配單元,把()內(nèi)的整體當作一個字符

正則匹配模式

正則匹配模式分為兩種吃谣,一種是貪婪模式乞封,另一種是非貪婪模式
貪婪模式:在遇到歧義時候盡可能的多的匹配符合的結(jié)果
非貪婪匹配:在遇到歧義時候匹配到一次符合的結(jié)果就不匹配了
js默認是貪婪匹配模式,貪婪模式變成非貪婪模式只需要在貪婪量詞({n, }, {n, m}, + , ?, *)后面加一個?就行了
附加:正則匹配中?的幾種用法

let reg = /\d??/;
let string = '123456';
console.log(string.replace(reg, 'haha'));

正則匹配前瞻后顧的概念

正則匹配的前瞻就是給正則匹配的選項定義一個斷言,或者說是一個條件比如:我要匹配一個字母岗憋,但是我的需求是字母后面必須是跟著一個數(shù)字的情況肃晚,那么這種場景是怎么實現(xiàn)了,就是用到前瞻的概念澜驮,那么我想要他的前面也要是一個數(shù)字怎么辦了陷揪,這就是后顧。
前瞻后顧的描述

正則 描述
(?=pattern) 正向肯定查找(前瞻),后面必須跟著什么
(?!pattern) 正向否定查找(前瞻)杂穷,后面不能跟著什么
(?:pattern) 非捕獲分組,即該分組不寫入$1,$2,....中
(?<=pattern) 反向肯定條件查找(后顧)悍缠,不捕獲
(?<!pattern) 反向否定條件查找(后顧)
(?<name>) 給分組起一個名字

正則匹配新特性

let string = 'a1dvb';
let reg = /\w(?=\d)/;
console.log(string.replace(reg, '---'));

特點

以上的三個匹配形式都是不被捕獲的,其中前兩個是不匹配的耐量,他只是用來當作條件來用飞蚓,第三個是要被匹配的

//  分組被匹配并且捕獲
let string = 'a1b3c4';
let reg = /(\w)(\d).+/;  //去掉加號就不同
string = string.replace(reg, '$1$2');
console.log(string);  //a1

// 分組被匹配但是不被捕獲
let string = 'a1b3c4';
let reg = /(?:\w)(\d).+/;  // 去掉加號就不同
string = string.replace(reg, '$1$2');
console.log(string);  // 1$2

// 分組不被匹配也不被捕獲,僅作為條件
let string = 'a1b3c49tt';
let reg = /(\d)(?=\d).+/;  // 去掉加號就不同
string = string.replace(reg, '$1$2');
console.log(string);  // 4$2

匹配原則----個人總結(jié)

1:任何元字符在沒有寫量詞的情況下廊蜒,只匹配一次
2:寫了量詞趴拧,默認是貪婪匹配
3:正則匹配一旦全部找到就不會在繼續(xù)去匹配溅漾,除非你設(shè)置了全局g
4:正則匹配按照匹配規(guī)如果中間中斷沒有匹配到,并且字符串沒有匹配完著榴,會繼續(xù)按照匹配規(guī)則重新匹配
5:(pattern)如果匹配到了很多結(jié)果添履,只捕獲最后一次匹配到的結(jié)果
6:任何量詞都只作用于前面的元字符

正則匹配相關(guān)的四個函數(shù)

正則對象的五個屬性

1:source 2:global 3:ingoreCase 4:multiline 5:lastIndex

屬性 描述
global 是一個只讀一個布爾值,用來描述是否帶有全局的修飾符
ingoreCase 是一個只讀一個布爾值脑又,用來描述是否帶有忽略大小寫的修飾符
multiline 是一個只讀一個布爾值暮胧,用來描述是否帶有換行的修飾符
source 就是匹配規(guī)則的文本本身
lastIndex 是一個可以讀寫的整數(shù),如果是全局搜索问麸,這個屬性的值是匹配到的字符的下一個字符的索引所對應(yīng)的值往衷, 直到?jīng)]有匹配為止,才會變成0严卖,如果不是全局始終為0
let reg = /\d/gmi;
console.log(reg.source);  // \d
console.log(reg.global); // true
console.log(reg.ignoreCase);  // true
console.log(reg.multiline);  // true
console.log(reg.lastIndex); 0

函數(shù)1:test

字符串滿足正則匹配規(guī)則就會返回true,但是如果正則匹配里面含有全局的話席舍,那么多運行幾遍會報錯,因為正則每次匹配開始都是看lastIndex的哮笆,全局情況下lastIndex每次執(zhí)行都會被改變

let reg = /\d/g;
let string = '1234';
console.log(reg.test(string));

// 全局情況
et reg = /\d/g;
let string = '12';
console.log(reg.test(string));  // true
console.log(reg.test(string)); // true
console.log(reg.test(string)); // false

函數(shù)2:exec

如果沒有找到任何匹配就返回null,如果找到了則返回一個數(shù)組来颤,exec方法返回的數(shù)組的第 0 個元素是與正則表達式相匹配的文本

第 1 個元素是 正則匹配到 的第 1 個子表達式相匹配的文本(如果有的話)

第 2 個元素是正則匹配到 的第 2 個子表達式相匹配的文本(如果有的話)

...

以此類推。
其中還有三個參數(shù)
index:表示匹配到的文本的第一個字符所在的索引位置
input: 表示被匹配的文本
groups:表示有名的分組
在全局下也是一樣因為exec永遠只返回第一個匹配稠肘。

let reg = /(\w)(\d)(\d)/;
let string = 'a11a233';
reg.exec(string); //  ["a11", "a", "1", "1", index: 0, input: "a11a233", groups: undefined]

let reg = /(?<json>\w)(?<tiantian>\d)(?<jianwu>\d)/;
let string = 'a11a233';
reg.exec(string);

函數(shù)3:match

如果沒有找到任何匹配就返回null,如果找到了則返回一個數(shù)組脚曾,match方法返回的數(shù)組的第 0 個元素是與正則表達式相匹配的文本

第 1 個元素是 正則匹配到 的第 1 個子表達式相匹配的文本(如果有的話)

第 2 個元素是正則匹配到 的第 2 個子表達式相匹配的文本(如果有的話)

...

以此類推。
其中還有三個參數(shù)
index:表示匹配到的文本的第一個字符所在的索引位置
input: 表示被匹配的文本
groups:表示有名的分組
在非全局的情況下启具,這個方法和exec一模一樣,但是在全局的情況下珊泳,差別很大鲁冯,在全局的情況下,只會返回匹配到的結(jié)果色查,并且lastIndex始終為0薯演, 如果沒匹配到就返回null

let reg = /(\w)(\d)(\d)/g;
let string = 'a11a233';
string.match(reg); // ["a11", "a23"]

函數(shù)4:replace

該方法用來替換字符串,第一個參數(shù)是正則表達式秧了,第二個參數(shù)可以是字符串也可以是函數(shù)

let string = '1a2a';
let reg = /\d+/;
string.replace(reg, '--'); // "--a2a"

// 捕獲分組形式
let string = '1a2a';
let reg = /(\d).+/;
string.replace(reg, '$1');  // 1

// 函數(shù)形式
let string = 'a11ab22b';
let reg = /(\w)(\d)(\d)/;
string.replace(reg, (match, firstP, secondP, thirdP, index, string) => {
console.log(match);
console.log(firstP);
console.log(secondP);
console.log(thirdP);
console.log(index);
console.log(string);
return 22
}) 
// a11 a 1 2 0 a11ab22b
其中對函數(shù)來說的話跨扮,第一個是匹配到的文本 
后面幾個參數(shù)是對應(yīng)分組的匹配文本(如果有的話)
倒數(shù)第二個是,匹配到的文本的第一個字符的索引
倒數(shù)第一個是验毡,被匹配的文本

附加

正則匹配測試工具

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末衡创,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子晶通,更是在濱河造成了極大的恐慌璃氢,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,204評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件狮辽,死亡現(xiàn)場離奇詭異一也,居然都是意外死亡巢寡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,091評論 3 395
  • 文/潘曉璐 我一進店門椰苟,熙熙樓的掌柜王于貴愁眉苦臉地迎上來抑月,“玉大人,你說我怎么就攤上這事舆蝴∏酰” “怎么了?”我有些...
    開封第一講書人閱讀 164,548評論 0 354
  • 文/不壞的土叔 我叫張陵须误,是天一觀的道長挨稿。 經(jīng)常有香客問我,道長京痢,這世上最難降的妖魔是什么奶甘? 我笑而不...
    開封第一講書人閱讀 58,657評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮祭椰,結(jié)果婚禮上臭家,老公的妹妹穿的比我還像新娘。我一直安慰自己方淤,他們只是感情好钉赁,可當我...
    茶點故事閱讀 67,689評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著携茂,像睡著了一般你踩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上讳苦,一...
    開封第一講書人閱讀 51,554評論 1 305
  • 那天带膜,我揣著相機與錄音,去河邊找鬼鸳谜。 笑死膝藕,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的咐扭。 我是一名探鬼主播芭挽,決...
    沈念sama閱讀 40,302評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼蝗肪!你這毒婦竟也來了袜爪?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,216評論 0 276
  • 序言:老撾萬榮一對情侶失蹤穗慕,失蹤者是張志新(化名)和其女友劉穎饿敲,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體逛绵,經(jīng)...
    沈念sama閱讀 45,661評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡怀各,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,851評論 3 336
  • 正文 我和宋清朗相戀三年倔韭,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片瓢对。...
    茶點故事閱讀 39,977評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡寿酌,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出硕蛹,到底是詐尸還是另有隱情醇疼,我是刑警寧澤,帶...
    沈念sama閱讀 35,697評論 5 347
  • 正文 年R本政府宣布法焰,位于F島的核電站秧荆,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏埃仪。R本人自食惡果不足惜乙濒,卻給世界環(huán)境...
    茶點故事閱讀 41,306評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望卵蛉。 院中可真熱鬧颁股,春花似錦、人聲如沸傻丝。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,898評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽葡缰。三九已至亏掀,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間泛释,已是汗流浹背幌氮。 一陣腳步聲響...
    開封第一講書人閱讀 33,019評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留胁澳,地道東北人。 一個月前我還...
    沈念sama閱讀 48,138評論 3 370
  • 正文 我出身青樓米者,卻偏偏與公主長得像韭畸,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子蔓搞,可洞房花燭夜當晚...
    茶點故事閱讀 44,927評論 2 355

推薦閱讀更多精彩內(nèi)容