JavaScript 正則應用詳解【模式、欲查、反向引用等】
本文實例講述了JavaScript 正則應用。分享給大家供大家參考，具體如下：
正則應用正則表達式在web開發中的常用
郵箱驗證用戶名驗證替換字符串某一部分信息采集，用來分析有效代碼段...
有規律的字符串描述
正則表達式是一門獨立的知識，同樣的一段描述，比如，對于email的匹配表達式，在不同的語言是一樣的，但是調用的函數不同。
正則表達式--規則表達式
正則表達式：正則表達式正則表達式語法：正則表達式語法正則表達式語言：正則表達式語言
準備性的工作
在js中，如何寫正則表達式。 /RegExp/
在js里，用正則表達式來驗證字符串是否滿足， 使用 reg.test(str);
用正則表達式的exec函數，用來查找匹配的選項，并把查找的值取出。
reg.test(str); 返回true 或者false 。 常在表單驗證中使用。
<from action='xxx.php' id='biaodan'> <p>請輸入姓名：<input type='text' /></p> <p>請輸入年齡：<input type='text' /></p> <p><input type='submit' /></p></from> <script> var oBD = document.getElementById(’biaodan’); var oName = document.getElementById(’name’); var oAge = document.getElementById(’age’);//表單試圖提交的時候，觸發onsubmit事件//這個函數返回了false,表單不會被提交 oBD.onclick = function(){ //驗證name if( !/^[u4e00-u9fa5]{2,4}$/.test(oName.value) ) return false; //驗證年齡 if( !/^d{2,3}$/.test(oAge.value) ) return false; if( parseInt( oAge.value )<10 || parseInt( oAge.value )>104 ) alert(’您輸入的年齡不在范圍’) return false; return true; }</script>
exec(); 返回 數組 或 null。exec是英語execute的意思，CEO首席執行官，E就是executive執行的“執行” 把正則式放到字符串上執行每次執行結果按序輸出，不管結果有幾個，一次只輸出一個 ，如果多次輸出，會保持前面的引用。當匹配超過原字符串的時候，會返回null。然后遇到null，指針返回到匹配的字符的第一位。 具有迭代器的感覺。
var str = ’ABCDEFG1234567abcdefg’;var reg = /[a-z]/g;console.log( a=/[a-z]/g.exec(str) );var a;while( a=reg.exec(str) ){ //這邊 null 為 fasle。 exec() 會保持對前面一次的引用。 需要使用 值來賦值。 console.log( a );}
使用exec() 找最大子串
var str = ’AAABBBCCCCCCC’;var reg = /(w)1+/g;var maxLength = 0;var maxLetter = ’’;var a;while( a=reg.exec(str) ){ if( a[0].length>maxLength ){ maxLength = a[0].length; maxLetter = a[0]; }}console.log( maxLetter );
var str=’BCDEFG1234567abcdefg’;var reg = /[a-z]/g;var a;while( (a=reg.exec(str)) != null ){ //先賦值給a，然后再與后邊判斷。 console.log( a );}
str.match( reg ); //查找，匹配到，返回數組 str.split( reg ); //拆分，返回數組str.serch( reg ); //查找位置str.replace( reg,’new str’); //正則替換，返回string
//測試是否含有hivar reg = /hi/; //僅看字符串是否有 hiconsole.log( reg.test(’hello’) ); //fasleconsole.log( reg.test(’this is iqianduan’) ); //true//測試單詞 hivar reg01 = /bhib/;console.log( reg01.test(’this is’) ); //falseconsole.log( reg01.test(’this is, hi,his’) );//true正則表達式 3 句話
要找什么字符？從哪兒找？找幾個？
要找什么字符字面值， ‘hi’ ，就是找‘hi’。
用字符的集合來表示 ， [abcd], 指匹配abcd中任意一個
//找不吉利的數字//3,4,7var reg = /[3,4,7]/; //字符集合， 不能使用 /347/ 字面值表示，是表示整體。 console.log( reg.test(’12121212’) );//falseconsole.log( reg.test(’12341234’) ); //true
用范圍表示字符 ， [0-9] [0123456789] [a-z] [A-Z]
// var reg = /[0123456789]/;var reg = /[0-9]/;console.log( reg.test(’123afsdf’) ); //trueconsole.log( reg.test(’asdf’) ); //false//是否有大寫字母var reg = /[A-Z]/;console.log( reg.test(’asdf’) );//falseconsole.log( reg.test(’Tomorrow is another day’) ); //true
字符簇, 花團錦簇-> 一坨字符。
系統為常用的字符集合，創建的簡寫.例如：
[0-9] --> d
[0-9a-zA-Z_] --> w .. 域名，注冊用戶名常用的模式.
[tvfrn] --> s 空白符.
//是否含有數字var reg = /d/;console.log( reg.test(’123afsdf’) ); //trueconsole.log( reg.test(’asdf’) ); //false
補集的形式來表示字符集合 在集合前面使用表示補集。
[0-9]---> [^0-9] ^ 脫字符號： 念法： caret。[’kærət] 。
[abcdef]-->[^abcdef]
//驗證全為數字 var reg = /^[0-9]/; //匹配非數字 // var reg = /^d/ //字符簇補集 console.log( reg.test(’aaaaa’) );//非數字存在 false console.log( reg.test(’123aaa’) ); //有數字存在 true
字符簇的補集：
d -- > D(非數字)
s --> S(非空白字符)
w --> W
任意字符 ： . 唯獨不包括換行符
從哪兒找，找到哪兒b 單詞邊界
/bhi/ --> 從單詞的邊界開始匹配hi。
// 匹配單詞hi,包括hi本身// var reg = /bhi.+/;//錯誤// var reg = /bhiw+/; //錯誤。 + --> 至少有 一個var reg = /bhiw*/; console.log( reg.exec(’this is’) ); //nullconsole.log( reg.exec(’his’) ); //['his', index: 0, input: 'his']console.log( reg.exec(’history’) ); //['history', index: 0, input: 'history,hi']
//匹配進行時的結尾var reg = /b[a-zA-Z]+ingb/;console.log( reg.exec(’going’) );//['going', index: 0, input: 'going']console.log( reg.exec(’1ting.com’) );//nullconsole.log( reg.exec(’ing’) );//null //2 -> to 4->for 0->zero
//匹配un前綴的反義詞//unhappy happy,hungry,sun,unhappyvar reg = /bun[w]+b/;console.log( reg.exec(’happy,hungry,sun,unhappy’) ); //['unhappy', index: 17, input: 'happy,hungry,sun,unhappy']
B 單詞的非邊界
// 把單詞中間的某一個部分取出來。 // 把中間含有hi的單詞取出，即hi不能在兩端。var reg = /BhiB/;console.log( reg.exec(’this’) ); //['hi', index: 1, input: 'this']console.log( reg.exec(’hi’) ); //null
^ creat , 從字符串的起始位置開始匹配
$ 匹配到字符串的結束位置
從字符串的開頭到結尾開始匹配，模擬運行順序.
var reg = /^lishi$/; console.log( reg.exec(’lishinihao’) ); nullconsole.log( reg.exec(’lishi’) ); //['lisi', index: 0, input: 'lisi']找多少
*， [0,n] --> {0, }+ , [1,n] -->{1, }? , [0,1] -->{0,1}n {n} {3} a{n} , 字符a準確的出現n次a{n,} 字符a，至少出現n次。 a{n,m} 字符串a，出現n到m次。
模式以匹配為例，默認情況下，找到一次結果符合就結束。告知匹配過程，一直找，在全文范圍內一直找。g -> 全局模式， global 找所有的，而不是找一次就結束i -> 忽略大小寫，ignore
//查找所有中間含有hi的單詞var reg = /BhiB/gi;var str = ’shit,hi,this,thit,THIS’;console.log( str.match(reg) ); //['hi', 'hi', 'hi', 'HI']
確定邊界是什么，那些東西必須有，那些東西可能有可能沒有。配合+，*
//把鏈接換成 #//<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' ></a> --> <a href='http://www.gepszalag.com/bcjs/16658.html#' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' ></a>//1,不能保留鏈接的文字(反向引用)//2,不能跨行(貪婪模式)var reg = /<a[s]+.*</a>/g;var str = ’<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' ></a>’;console.log( str.replace(reg,’<a href='http://www.gepszalag.com/bcjs/16658.html#' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >文字</a>’) );
js不支持單行模式。
//s 單行模式：把整個字符串看成一行. 代表任意，但不包括換行。
在js里，不支持當行模式的情況下，如何換行？
什么樣的模式能代表“所有” 字符串 sS 全部字符 使用一個技巧， 一個集合加補集，就是全集[dD] [sS] [wW]
var reg = /<a[s][sS]+</a>/g;var str = ’<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >’+ ’</a>’;console.log( str.replace(reg,’<a href='http://www.gepszalag.com/bcjs/16658.html#' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >文字</a>’) );//s 多行模式：碰到一行就把當前的當成一個字符串來解析
//把每一行的結尾的數字換成 #//車牌號//Cx003//A0008//B3456var str = ’Cx003’+’A0008’+’B3456’;var reg = /d+$/gm;console.log( str.replace(reg,’#’) );貪婪模式
貪婪模式
如果’?’緊跟在在任何量詞*, + , ?，或者是{}的后面，將會使量詞變成非貪婪模式（匹配最少的次數），和默認的貪婪模式（匹配最多的次數）正好相反。比如，使用/d+/非全局的匹配“123abc”將會返回“123”，如果使用/d+?/,那么就只會匹配到“1”。
當正則表達式中包含能接受重復的限定符時，通常的行為是（在使整個表達式能得到匹配的前提下）匹配盡可能多的字符。以這個表達式為例：a.b，它將會匹配最長的以a開始，以b結束的字符串。如果用它來搜索aabab的話，它會匹配整個字符串aabab。這被稱為貪婪匹配。
任何量詞后面 跟 ? 代表非貪婪模式 ， 滿足條件就不找了，小富即安，打完收工。 修飾個數，盡量少找和多找的。
//goooooooooods --> goodsvar str = ’goooooooooods,goooods,goooood,gooooo,gooooods’;var reg = /g[o]{3,}?ds/g;console.log( str.replace(reg,’goods’) ); //goods,goods,goooood,gooooo,goods 欲查正向欲查
欲查不消耗字符。
//查找進行時的單詞的詞根， 即 不要ing 。 going -> govar str = ’going,comming,fly’;// var reg = /b[a-zA-Z]+ingb/g;var reg = /b[w]+(?=ing)b/g; // 類似探照燈，先去判斷幾位是否滿足，滿足返回，不滿足繼續下一位.console.log( str.match(reg) );
滿足 ing ，找到com。
不滿足接著走。 看見不滿足條件，并不會一次性調到ing后面接下去尋找，而是從該處光標繼續尋找。已經查找的詞是消耗了，下次從該處光標開始尋找。
//查找進行時的單詞的詞根， 即 不要ing 。 going -> govar str = ’going,comming,fly’;// var reg = /b[a-zA-Z]+ingb/g;// var reg = /b[a-zA-Z]+(?=ing)b/g; //結尾b 是錯誤的， 欲查不消耗字符， 相當于/b[a-zA-Z]+b/ 這種形式var reg = /b[a-zA-Z]+(?=ing)/g; // 類似探照燈，先去判斷幾位是否滿足，滿足返回，不滿足繼續下一位.console.log( str.match(reg) ); // ['go', 'comm'] 負向欲查
不是誰才行。 往后看一定位數，不是誰才可以。 不要后面是某某某的東西。
//查找win98,win95,win32,win2003,winxp -->win98,win32,win2003,winxpvar str = ’win98,win95,win32,win2003,winxp’;var reg = /bwin(?!95)/g;console.log( str.match(reg) ); // ['win', 'win', 'win', 'win']
js不支持，向前正向欲查，向前負向欲查：
//找出 un系列單詞的詞根var reg = /[w]+(?<=un)/g;var str = ’unhappy’;console.log(str.match(reg)); //報錯var reg = /[w]+(?<!=un)/g; //向前負向欲查反向引用
反向引用，也叫后向引用。或者分組或子表達式
一般是整個表達式， 但是中間的部分 有特殊做了描述。 需要的部分特殊處理。使用分組，叫做子表達式。
//把鏈接換成空連接，保持文字信息。 var str = ’<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >陰天快樂</a>’; var reg = /<a[s]+[^>]+>([^<>]+)</a>/; //超鏈接的表達式 console.log( reg.exec(str) ); //['<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >陰天快樂</a>', '陰天快樂', index: 0, input: '<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >陰天快樂</a>'] //能夠把子表達式的東西匹配出來。 // console.log( str.replacte(reg,’#’) ); /** <a[s]+[^>]>([^<>]+)</a> 主要目的是想要中間那一塊 除了>之外的都可行 ， 取> 的補集 [^>] 中間部分純文字，不含大于號，和小于號。 取小于號和大于號的補集 [^<>]+ / [sS]+ */ //一般是整個表達式， 但是中間的部分 有特殊做了描述。 需要的部分特殊處理。使用分組，叫做子表達式。 //匹配html // /<s*(S+)(s[^>]*)?>[sS]*<s*/1s*>/ /*exec為例： 匹配到的數組，第0個單元，代表'整個正則表達式的匹配結果' 1,2,3,4....N,則代表第N個子表達式匹配的結果。 //js頂多有9個子表達式。 // ['<a 陰天快樂', index: 0, input: '<a rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >陰天快樂</a>'] */ console.log( str.replace(reg,’<a href='http://www.gepszalag.com/bcjs/16658.html#' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >$1</a>’) ); //<a href='http://www.gepszalag.com/bcjs/16658.html#' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' rel='external nofollow' >陰天快樂</a> var str = ’<html></html>’; var reg = /<s*(S+)(s[^>]*)?>[sS]*<s*/1s*>/; console.log( reg.exec(str) ); str.replace(reg,function( $1,$2 ){ console.dirxml($2); //html });
如何引用子表達式所匹配的結果?
在正則外邊使用：$N 來匹配 第N個子表達式的匹配結果。
在正則里邊使用N來 使用第N個子表達式。
更多關于JavaScript相關內容感興趣的讀者可查看本站專題：《JavaScript正則表達式技巧大全》、《JavaScript替換操作技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》、《JavaScript中json操作技巧總結》、《JavaScript錯誤與調試技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章：
網公網安備