JavaScript正則表達(dá)式基本使用
- 定義正則表達(dá)式：
var reg=/java/; var reg2=new RegExp('java')
第一部分锭部、javaScript中正則有關(guān)的幾個函數(shù)
-
String.prototype.search
- 找出字符串中某個字符串首次出現(xiàn)的位置
'i love javaScript'.search(/love/); //2 'i love javaScript'.search(/like/);//-1 -
String.prototype.replace(regexp|substr,newSubStr|function)
- 形參：regexp為正則對象或者正則字面量，全局的時(shí)候需要g政基，sub為要被替換的字符串思杯，newSubStr為用于替換的新字符串胜蛉，其中可以插入一些特殊變量名，function改函數(shù)的返回值將替換掉第一個參數(shù)的匹配結(jié)果色乾。
- 替換正則匹配的子字符串,返回替換后的新字符串誊册，原先的不變
'i love javaScript'.replace(/love/,'like') //i like javaScript使用字符串作為參數(shù)，替換字符串可以插入如下變量名
字符 替換文本 2
與正則中的第1到99個子表達(dá)式想匹配的文本 $& 與正則相匹配的字串 $` 匹配子串左側(cè)文本 $' 匹配字串右側(cè)文本 $$ 美元符號$ - replace的第二個參數(shù)可以為函數(shù)暖璧，函數(shù)的參數(shù)是匹配到的串兒
-
String.prototype.split(separator,limit)
- 形參：separator為字符串或者正則案怯，limit需要的數(shù)組的長度
- 返回值：分割字符串，以數(shù)組的形式反回
- 注意：
- 如果分隔符是包含捕獲括號的正則表達(dá)式澎办，則每次分隔符匹配時(shí)嘲碱，捕獲括號的結(jié)果會被拼接到數(shù)組中，并不是瀏覽器都支持
'love'.split('',3) //['l','o','v'] 'i love javascript i like node js'.split(/l[oi][vk]e/) // ["i ", " javascript i ", " node js"] 'i love javascript i like node js'.split(/(l[oi][vk]e)/) // ["i ", "love", " javascript i ", "like", " node js"] ''.split(';') // [''] ''.split('') // [] 'love'.split('') // ['l','o','v','e'] -
String.prototype.match
- 捕獲字符串的子字符串到一個數(shù)組中局蚀，默認(rèn)只匹配一個
'i love java javaScript'.match(/java/) // ["java", index: 7, input: "i love java javaScript"] 'i love java javaScript'.match(/java/g) //["java", "java"] -
RegExp.prototype.test
- 用來測試字符串中是否含有子字符串
/javaScript/.test('i love javaScript') //true -
RegExp.prototype.exec
- exec方法一次只能匹配一個子字符串,即使含有g(shù)
var reg = /script/g; var str = 'i love javascript and typescript Javascript' reg.exec(str) // ["script", index: 11, input: "i love javascript and typescript Javascript"] reg.lastIndex //17 reg.exec(str) //["script", index: 26, input: "i love javascript and typescript Javascript"] reg.lastIndex //32 reg.exec(str) // ["script", index: 37, input: "i love javascript and typescript Javascript"] reg.lastIndex //43 reg.exec(str) // null reg.lastIndex // 0 reg.exec(str) // ["script", index: 11, input: "i love javascript and typescript Javascript"] reg.lastIndex //17
第二部分麦锯、正則表達(dá)式基礎(chǔ)
更多詳細(xì)教程請參考：菜鳥教程鏈接
-
元字符
字符 匹配規(guī)則 \d 匹配數(shù)字，大寫取反 . 除換行符以外的任意字符 \w 匹配字母數(shù)字下劃線琅绅，大寫取反 \s 匹配空白符號扶欣，大寫取反 \b 匹配單詞邊界 ^$ 開始結(jié)束 \num 對所獲取的匹配的引用 '(.)\1' 匹配兩個連續(xù)的相同字符 -
數(shù)量有關(guān)
字符 規(guī)則 {n} 匹配n次 {n,} 至少比n次 {n,m} 匹配n-m次 * 等價(jià)于{0,} + 等價(jià)于{1,} ? 等價(jià)于{0,1} - 貪婪與懶惰：正則表達(dá)式匹配盡量多的字符，例如
/test\d*//.match('test123')返回test123千扶。在標(biāo)識符后添加?可以使其匹配盡量少的字符料祠。
- 貪婪與懶惰：正則表達(dá)式匹配盡量多的字符，例如
-
字符范圍
字符 匹配規(guī)則 [a-z] 匹配a-z任意字符 [\u4E00-\u9FA5] 找出Unicode編碼范圍是\u4e00到\u9FA5的字符，判斷是否有漢子 -
分組
- ()：匹配并獲取匹配
- replacer函數(shù)中澎羞，JavaScript可以用
9獲取對應(yīng)內(nèi)容
'i love javaScript'.replace(/(love)/,'$1 $1') //'i love love javaScript' - match函數(shù)：表達(dá)式有全局屬性時(shí)髓绽，捕獲所有符合的表達(dá)式，沒有全局屬性時(shí)妆绞，匹配第一個結(jié)果梧宫，將匹配到的字符串放入結(jié)果數(shù)組
'i love java javaScript'.match(/(java)/) //["java", "java", index: 7, input: "i love java javaScript"] 'i love java javaScript'.match(/(java\w*\b)/g) // ["java", "javaScript"] 'i love java javaScript'.match(/(java\w*) (java\w*)/) // ["java javaScript", "java", "javaScript", index: 7, input: "i love java javaScript"] - exec函數(shù)：忽略全局屬性，只返回一個結(jié)果和分組結(jié)果
/(java) (javaScript)/g.exec('i love java javaScript java javaScript') // ["java javaScript", "java", "javaScript", index: 7, input: "i love java javaScript java javaScript"]
-
分支條件：'|'分支條件影響兩邊所有內(nèi)容
'javaScript typeScript'.match(/(java|type)Script/g) // ["javaScript", "typeScript"] 'javaScript typeScript'.match(/java|typeScript/g) // ["java", "typeScript"] -
斷言
- (?=exp):用來捕獲正則表達(dá)式的后面摆碉，捕獲括號內(nèi)前面的內(nèi)容塘匣，不分配組號
'i love javaScript'.match(/l\w+\s+(?=java\w*)/) // ["love ", index: 2, input: "i love javaScript"] - (?!exp):用在正則表達(dá)式后面，捕獲后面不是括號內(nèi)的字符
- (?:exp)：會匹配分組中的內(nèi)容巷帝，但是不再分配組號忌卤，在replace，match等函數(shù)中作用也會消失楞泼。例如驰徊， 'industr(?:y|ies) 就是一個比 'industry|industries' 更簡略的表達(dá)式
'i love javaScript'.match(/(java\w*)/) // ["javaScript", "javaScript", index: 7, input: "i love javaScript"] 'i love javaScript'.match(/(?:java\w*)/) //["javaScript", index: 7, input: "i love javaScript"]
- (?=exp):用來捕獲正則表達(dá)式的后面摆碉，捕獲括號內(nèi)前面的內(nèi)容塘匣，不分配組號
-
三個處理選項(xiàng)：
內(nèi)容 標(biāo)記 文字描述 i ignoreCase 忽略大小寫 g globle 全局匹配 m mutiple 多行匹配
第三部分笤闯、正則表達(dá)式高級
-
工作原理
，正則表達(dá)式在JavaScript中執(zhí)行主要分為以下四個部分棍厂，編譯=>設(shè)置開始位置=>正則匹配=>匹配結(jié)果這四部分
第四部分颗味、ES6的正則擴(kuò)展
- 構(gòu)造函數(shù)：RegExp構(gòu)造函數(shù)第一個參數(shù)是正則對象，第二個參數(shù)指定修飾符時(shí)會忽略原有正則的修飾符牺弹。
- 字符串對象的四個方法match浦马、replace、search张漂、split內(nèi)部全部調(diào)用RegExp的實(shí)例方法晶默，例如search調(diào)用RegExp.prototype[Symbol.search]
- u修飾符：用來正確處理大于\uFFF的Unicode字符，可以正確處理4個字節(jié)的UTF-16編碼
- y修飾符(粘連sticky)：與g相似航攒，g只要求剩余位置中存在匹配就可以磺陡，y需要確保匹配從剩余的第一個位置開始。設(shè)計(jì)本質(zhì)是讓頭部匹配標(biāo)志^在全局匹配中都有效
- sticky屬性漠畜，表示是否設(shè)置了y修飾符
- flag屬性：返回正則的修飾符
- s修飾符：.可以匹配任意單個非終止符（終止符：換行符\n 回車符\r弥搞，行分隔符辩昆，段分隔符）筹吐，引入/s修飾符鳄逾，使得可以匹配任意單個字符酱鸭，與之對應(yīng)的dotAll表示是否處在doAll模式下抖仅。
- V8 4.9已經(jīng)支持后行斷言
- 具名組匹配瞧筛，為每個分組起一個名字
- 此部分參考ES6標(biāo)準(zhǔn)入門
第五部分侠碧、常用正則表達(dá)式
- 郵箱匹配：
/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/ - 正則表達(dá)式鏈接
第六部分硝枉、實(shí)例
// 將字符串中所有的<img/>標(biāo)簽替換為<span/>標(biāo)簽
textHTML.replace(/(<img.+?text="\S+".+?>)/gi,
match => match.replace(/<img.+text="(\S+?)".+>/, '<span>$1</span>')
// 校驗(yàn)URL
/^(?!mailto:)(?:(?:http|https|ftp)://|//)(?:\S+(?::\S*)?@)?(?:(?:(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[0-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]+-?)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]+-?)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))|localhost)(?::\d{2,5})?(?:(/|\?|#)[^\s]*)?$/
參考資料：
- 正則表達(dá)式可視化：https://jex.im/regulex
- MDN文檔：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp
- es6標(biāo)準(zhǔn)入門：http://es6.ruanyifeng.com/#docs/regex
- 掘金文章（推薦）https://juejin.im/post/5965943ff265da6c30653879
