摘要:正則表達(dá)式小結(jié)創(chuàng)建方式直接量語法創(chuàng)建對象的語法語法屬性說明我們寫的正則表達(dá)式的規(guī)則,而則是規(guī)則的修飾符,為全局匹配,為區(qū)分大小寫的匹配,為多行匹配。注意正則表達(dá)式,一定要加上修飾符。
背景介紹
這幾天,剛來公司,導(dǎo)師安排點任務(wù)增加些功能,以便熟悉了開發(fā)環(huán)境。接到的任務(wù)中,有一個環(huán)節(jié)需要處理一個業(yè)務(wù)的json數(shù)據(jù),具有多級嵌套,我要做的是讓使用者可以修改其中的"userName"。
有兩個思路利用正則表達(dá)式進(jìn)行匹配替代
利用遍歷修改鍵值
當(dāng)然,看到兩個思路的高下,在大部分情況下都是可以直接得出結(jié)論的,正則肯定是優(yōu)于遍歷的。
正則表達(dá)式小結(jié) 創(chuàng)建方式直接量語法
/pattern/attributes
創(chuàng)建RegEx對象的語法
new RegExp(pattern,attributes)
語法屬性說明:pattern我們寫的正則表達(dá)式的規(guī)則,而attributes則是規(guī)則的修飾符,g為全局匹配,i為區(qū)分大小寫的匹配,m為多行匹配。
語法 括號用于查找某個范圍內(nèi)的字符
[acg] //匹配acg任一項即可 [^acg]//匹配acg之外的任何一個字符 [a-z] //匹配a到z 26個小寫字母的任何一個即可 [A-Z] //匹配A到Z 26個大寫字母的任何一個即可 (red|blue|green) //匹配red或者blue或者green任何一個即可元字符
擁有特殊含義的字符
. //查找單個字符,除了換行以及行結(jié)束符 w //查找單詞字符 W //查找非單詞字符 d //查找數(shù)字 D //查找非數(shù)字 xxx //查找八進(jìn)制書xxx規(guī)定的字符量詞
描述規(guī)則執(zhí)行的次數(shù)要求以及位置要求
n+ //匹配任何包含至少一個n的字符串 n? //匹配任何包含零個或者一個n的字符串 n* //匹配包含任一個n的字符串 n{x,y} //匹配包含x到y(tǒng)次n的字符串 ^n //匹配開頭含有n的字符串 n$ //匹配結(jié)尾有n的字符串 ?=n //匹配任何其后緊跟指定字符串n的字符串 ?!n //匹配任何其后沒有緊跟字符串n的字符串 //匹配一個字邊界,即字與空格間的位置 B //非字邊界匹配方法 RegExp的方法
compile 編譯正則表達(dá)式
exec 執(zhí)行正則表達(dá)式,并返回找到的值與位置
test 檢測是否真的含有符合正則表達(dá)式的字符串,返回布爾值
String對象的方法search 檢索與正則表達(dá)式相匹配的值
match 找到一個或者多個正則表達(dá)式的匹配
replace 替換與正則表達(dá)式相匹配的子串
split 把字符串分割為字符串?dāng)?shù)組
小知識點集錦 子表達(dá)式一個正則表達(dá)式可分為許多子表達(dá)式
例子:利用子表達(dá)式可以將通用資源指示符 (URI) 分解為其組件。假定您想將下面的 URI 分解為協(xié)議(ftp、http 等等)、域地址和頁/路徑
var test = http://www.w3cschool.cc:80/html/html-tutorial.html; /w+://[^/:]+:d*?[^# ]*/.exec(test) //只可以匹配到鏈接 //輸出結(jié)果 ["http://www.w3cschool.cc:80/html/html-tutorial.html", index: 0, input: "http://www.w3cschool.cc:80/html/html-tutorial.html"] /(w+)://([^/:]+)(:d*)?([^# ]*)/.exec(test) //不僅可以匹配到鏈接,還可以把鏈接分為各個部分輸出 //輸出結(jié)果 ["http://www.w3cschool.cc:80/html/html-tutorial.html", "http", "www.w3cschool.cc", ":80", "/html/html-tutorial.html", index: 0, input: "http://www.w3cschool.cc:80/html/html-tutorial.html"]貪婪的量詞
? * + 三者都是貪婪的
因為他們會盡可能多的匹配字符串,只要在他們后面再加一個?就可以實現(xiàn)非貪婪或者最小匹配
實例如下
圓括號的副作用消除Hello world!
//下面的表達(dá)式匹配從 < 到關(guān)閉h1標(biāo)記的 >之間的所有內(nèi)容 /<.*>/ //如果你只需要匹配開始的h1標(biāo)記,下面的非貪婪表達(dá)式只匹配
/<.*?>/
圓括號有一個副作用,那就是相關(guān)匹配會被緩存,此時可在在圓括號中加上?:在寫正則表達(dá)式
/(?:<.*>)/String.match(/<.+>/g) 與 RegExp.exec(string)的區(qū)別
不得不說這個是讓我迷惑的很久的坑
String.match(/<.+>/g)
這個是字符串方法,返回數(shù)組,包括與正則表達(dá)式匹配的第一個或者所有字符串,是否返回多個值由修飾符g決定(不返回子表達(dá)式的匹配結(jié)果)
RegExp.exec(string)
這個是正則表達(dá)式對象的特有方法,返回一個數(shù)組。數(shù)組包含:正則表達(dá)式匹配到的第一個字符串,各個子字符串匹配到的字符串,另外還有兩個鍵值index與input,分別輸出匹配到的字符串的第一個字符的位置與被檢測的字符串。
所以想要輸出()的子字符串匹配的字符串必須要用exec,(?:)同樣也只要在用exec的時候才能檢測到效果。
RegExp.exec(string) 總結(jié)介紹
這個可以取到各個子表示的結(jié)果,并且可以返回對應(yīng)的index值。擁有非常大的想象空間。比如我想獲
取"userName":"test"的值使用match,我們需要先匹配整個鍵值對,再對這個鍵值對進(jìn)行處理才能取到鍵值。而使用exec,通過子表達(dá)式,我們則直接可以獲取到鍵值。
當(dāng)然,exec有個蛋疼的地方是只能取到第一個匹配的字符串,也就是說修飾符g設(shè)置沒設(shè)置對他來說都一樣。
那我們?nèi)绾斡胑xec來全局匹配呢?
首先,我們來了解一下exec的一個特殊地方
當(dāng)exec執(zhí)行全局匹配模式時,exec的行為就略有變化。這時它會定義lastIndex屬性,以指定下一次執(zhí)行匹配時開始檢索字符串的位置。在找到了與表達(dá)式相匹配的文本之后,exec方法將把正則表達(dá)式的lastIndex屬性設(shè)置為下一次匹配執(zhí)行的第一個字符的位置。也就是說,可以通過反復(fù)地調(diào)用exec方法來遍歷字符串中的所有匹配文本。當(dāng)exec再也找不到匹配的文本時,將返回null,并且把屬性lastIndex重置為0。
var s = "Hello world Hello world"; // 測試使用的字符串直接量 var r = /Hello/g; // 匹配模式 一定要加上修飾符g while((a = r.exec(s)) != null){ // 循環(huán)執(zhí)行匹配操作 console.log(a); console.log(r.lastIndex); /* 顯示每次匹配操作時返回的結(jié)果數(shù)組信息*/ }
測試結(jié)果
["Hello", index: 0, input: "Hello world Hello world Hello world"] 5 ["Hello", index: 12, input: "Hello world Hello world Hello world"] 17
bingo,完成全局匹配。注意正則表達(dá)式,一定要加上修飾符g。要不然lastindex并不會改變,
循環(huán)會始終為真,不斷執(zhí)行。
這篇小結(jié),也是花了好幾個小時去查資料,測試最后寫出來的,之前也看過許多正則的資料,卻始終停留在看看,認(rèn)為知道了,每次想起來的時候,又都忘了,前幾天,用的時候就手忙腳亂的邊查資料邊coding。終于認(rèn)識到了自己的學(xué)習(xí)方式給自己帶來的深刻問題。
其實,走上技術(shù)的路,時間也不短了。
但確實在技術(shù)學(xué)習(xí)的路上,有許多觀點,隨著時間與自身情況的變化,并未及時的更新。
曾經(jīng),在決定未來走向的時候,為了海量的獲取信息來看到更遠(yuǎn)的未來,從而找尋一條能夠堅定走下路。讀書與閱讀的時候,采用快速閱讀的方式,不去細(xì)細(xì)咀嚼,只覺得看過一遍,迅速了解擴展視野,了解更多的東西就好。開始的時候,這種方式為我建立了認(rèn)知,獲得了遠(yuǎn)大于自身水平的視野。但是視野不曾有技術(shù)的支撐,只是一幢危樓而已。行之今日,這種學(xué)習(xí)方式暴露的問題,越來越大。后來,雖有意識,卻不曾有動力予以改正。
幸得近來被人指正,得以真正意識到問題的嚴(yán)重性。
非自己所研究的方向,有一定認(rèn)識就好,用不著過度深入,采用快速閱讀的方式,自然是極好的。能夠快速建立認(rèn)識。但是真正自己的研究方向,發(fā)散性閱讀才是更好的方式,對于每個點,都不僅僅局限于理解這一個點,能夠另行查閱許多相關(guān)的資料,這樣的方式,看一本書讀懂一本書,并擴展閱讀了許多相關(guān)的資料。這確實是更為行之有效的技術(shù)學(xué)習(xí)方式。而不像之前的方式,看似讀過,卻處處有漏洞,不曾真正的讀透一本書,希望臨到項目,臨到業(yè)務(wù)。再去真正實踐,去真正的掌握。是一種極為不靠譜的方式。
學(xué)習(xí)的方法的重要性,不亞于學(xué)習(xí)本身,也是值得我們?nèi)シ此疾⒏倪M(jìn)的。
參考資料正則表達(dá)式|菜鳥教程
W3Cschool正則表達(dá)式
使用exec增強正則表達(dá)式功能
WilsonLiu"s blog首發(fā)地址:http://blog.wilsonliu.cn
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/78507.html
摘要:添加依賴到如何使用依賴當(dāng)你再興建一個文件的時候,就不需要一個個插件安裝了,將文件復(fù)制到當(dāng)前文件下,并輸入,即通過里的依賴關(guān)系,自動把依賴安裝好了。第四步新建配置文件默認(rèn)的配置文件在項目目錄下為。 WilsonLius blog 首發(fā)地址 前言 早就想嘗試webpack的,卻一直沒有時間,恰逢周末,又時值最近在公司實習(xí)的時候嘗到用fekit做模塊化的構(gòu)建工具的爽。所以就開始以公司的項目結(jié)...
摘要:最近在全力整理高性能的文檔,并重新學(xué)習(xí)一遍,放在這里方便大家查看并找到自己需要的知識點。 最近在全力整理《高性能JavaScript》的文檔,并重新學(xué)習(xí)一遍,放在這里方便大家查看并找到自己需要的知識點。 前端開發(fā)文檔 高性能JavaScript 第1章:加載和執(zhí)行 腳本位置 阻止腳本 無阻塞的腳本 延遲的腳本 動態(tài)腳本元素 XMLHTTPRequest腳本注入 推薦的無阻塞模式...
摘要:下面是一些常見的理解性問題,每一個問題盡量用圖或代碼去描述。內(nèi)容全部來自,包括基本語法數(shù)組集合類泛型面向?qū)ο罄厥债惓?刂戚斎胼敵龊蛢?nèi)存。不斷更新,歡迎大家提出有趣味的問題和意見。 程序員經(jīng)??梢酝ㄟ^搜索或者記憶來完成代碼,但是許多時候并不真正理解為什么那樣寫。也就是說,有一定經(jīng)驗的程序員不會犯一些低級的語法錯誤,但是因為不深入理解有可能造成一些高級錯誤,比如說運行無效率,代碼難De...
摘要:性能訪問字面量和局部變量的速度是最快的,訪問數(shù)組和對象成員相對較慢變量標(biāo)識符解析過程搜索執(zhí)行環(huán)境的作用域鏈,查找同名標(biāo)識符。建議將全局變量存儲到局部變量,加快讀寫速度。優(yōu)化建議將常用的跨作用域變量存儲到局部變量,然后直接訪問局部變量。 缺陷 這本書是2010年出版的,這本書談性能是有時效性的,現(xiàn)在馬上就2018年了,這幾年前端發(fā)展的速度是飛快的,書里面還有一些內(nèi)容考慮IE6、7、8的東...
摘要:部分參考阮一峰標(biāo)準(zhǔn)入門基礎(chǔ)知識簡單來講,正則表達(dá)式是一些用來匹配和處理文本的字符串。 ES6部分參考阮一峰ES6標(biāo)準(zhǔn)入門 1. 基礎(chǔ)知識 簡單來講,正則表達(dá)式是一些用來匹配和處理文本的字符串。 // pattern可以使用任何簡單或復(fù)雜的正則表達(dá)式 // flags用以標(biāo)明正則表達(dá)式的行為,每個正則表達(dá)式可以帶有一個或多個標(biāo)識 var expression = /pattern/fla...
閱讀 1004·2021-11-24 10:30
閱讀 2329·2021-10-08 10:04
閱讀 3972·2021-09-30 09:47
閱讀 1453·2021-09-29 09:45
閱讀 1448·2021-09-24 10:33
閱讀 6281·2021-09-22 15:57
閱讀 2361·2021-09-22 15:50
閱讀 4092·2021-08-30 09:45