摘要:字符串對象的方法返回替換后的值常用于消除首尾空格方法的第二個參數可以使用美元符號來指代所替換的內容指代匹配的子字符串。與的區別在于當正則表達式加了標識符時,結果不同。
出場
為了匹配規定模式的文本
為了守護世界的和平
我們是穿梭在銀河的正則表達式
就是這樣~喵~
好用的正則表達式可視化工具: https://regexper.com/
語法//字面量 var regExp1 = /pattern/flags; //或用構造函數 var regExp2 = new RegExp(pattern[, flags]);
pattern:正則表達式的匹配模式
flags:可選,正則表達式的標識,也可選多個。g全局匹配,i忽略大小寫,m匹配多行
一顆超簡單的栗子:
var regExp = /abc/; "abcdefg".replace(regExp, "WOW"); // "WOWdefg"常用特殊字符 1.字符集合
字符 | 舉例 | 含義 |
[] | [xyz] | xyz中任意一個字符 等價于[x-z] |
[^] | [^xyz] | 匹配任意不在xyz中的一個字符,等價于[^x-z] (注意與^x區分,后者表示匹配以x開頭的字符) |
[-] | [1-3] | 匹配123中的任意一個字符,等價于[123]。注意:連字符只有出現在方括號中才表示連續的字符序列。 |
預定義模式就是某些常用模式的簡寫。
字符 | 含義 |
. | 除 和 之外的任意字符,等價于[^ ] |
d | 數字0-9,等價于[0-9] |
D | 非數字字符,等價于[^0-9] |
w | 字母數字下劃線,等價于[A-Za-z0-9_] |
W | 非字母數字下劃線,等價于[^A-Za-z0-9_] |
s | 空白符 |
S | 非空白符 |
換行符 |
正則模式中,需要用斜杠轉義的:
* + ? $ ^ . | ( ) { } [ ]
需要特別注意的是,如果使用RegExp方法生成正則對象,轉義需要使用兩個斜杠,因為字符串內部會先轉義一次。
4.邊界字符 | 舉例 | 含義 |
^ | ^a | 以a開頭(注意與[^]區分,后者表示匹配不在[^]中的元素) |
$ | a$ | 以a結尾 |
smart,smart | 單詞邊界,即[A-Za-z0-9_]之外的字符 | |
B | Bsmart | 非單詞邊界 |
舉個栗子說 和 B :
"You are smart, but she is smarter.".replace(/smart/,"kind"); //"You are kind, but she is smarter." "You are smart, but she is smarter.".replace(/smartB/,"kind"); //"You are smart, but she is kinder."
if(看不懂){ 就置幾動手試試吧 (? ??_??)? }
5.數量詞字符 | 含義 |
? | 匹配前面的模式 0或1次 {0,1} |
* | 匹配前面的模式 0或多次 {0,} |
+ | 匹配前面的模式 1或多次 {1,} |
{n} | 匹配前面的模式 n次 |
{n,} | 匹配前面的模式 至少n次 |
{n,m} | 匹配前面的模式 至少n次,至多m次 |
{0,m} | 匹配前面的模式 至多m次 |
x(?=y) | 只有x后面緊跟著y時,才匹配x,但是y不是匹配結果的一部分。例如/smart(?=girl)/只有后面有girl時,才匹配smart,但是girl不是匹配結果的一部分。 |
x(?!y) | 只有x后面不緊跟著y時,才匹配x。例如/d+(?!.)/只有一個數字后面沒有緊跟著小數點時才會匹配該數字,/d+(?!.)/.exec("3.141")匹配結果是141。 |
默認是貪婪模式匹配,即匹配盡可能多的字符。
var regExp1 = /d{3,6}/; "1234567890".replace(regExp1, "X"); //"X7890"
若想手動開啟懶惰模式,需要在模式后加 ?
var regExp1 = /d{3,6}?/; "1234567890".replace(regExp1, "X"); //"X4567890"7.分組與反向引用
分組又叫“子表達式”,把完整的正則表達式分成一個個小組,然后反過來用“組號”去引用這些小組就叫“反向引用”。
用例子來說:
//無分組 var regExp1 = /abc{2}/; //這樣量詞{2}只能匹配到c一個字符 //分組 var regExp2 = /(abc){2}/; //這樣量詞{2}就可以匹配到abc三個字符啦 //同時 abc 也有了一個組號 $1
再看一個栗子:
var reg = /(d{1}).*(d{2}).*(d{3})/; "1sss23sss456".replace(reg,"$1?$2?$3"); //"1?23?456"
上面的栗子換一種使用分組的方式:
var reg = /(d{1}).*(d{2}).*(d{3})/; var result = reg.exec("1sss23sss456"); console.log(result[1]+"-"+result[2]+"-"+result[3]); //"1-23-456"
組匹配非常有用,下面是一個匹配網頁標簽的例子:
var tagName = /<([^>]+)>[^<]*1>/; // 1 就是第一個組匹配的內容 tagName.exec("bold")[1]
上面代碼稍加修改,就可以捕獲帶有屬性的標簽:
var html = "Helloworld"; var tag = /<(w+)([^>]*)>(.*?)1>/g; var match = tag.exec(html); match[1] // "b" match[2] // " class="hello"" match[3] // "Hello" match = tag.exec(html); match[1] // "i" match[2] // "" match[3] // "world"
非捕獲組: (?:x) 表示不返回該組匹配的內容,即匹配的結果中不出現這個括號。
常用方法 正則對象的方法 1.RegExp.prototype.test()測試當前正則是否能匹配目標字符串,返回布爾值。
var reg = /d{2}/; var str = "1sss23sss456"; reg.test(str); //true2.RegExp.prototype.exec()
在目標字符串中執行一次正則匹配操作,返回匹配的子字符串。
var reg = /d{2}/; var str = "1sss23sss456"; var result = reg.exec(str); result[0]; //23 result.index; //4 result.input; //"1sss23sss456"3.RegExp.prototype.toString()
返回一個字符串,其值為該正則對象的字面量形式。覆蓋了Object.prototype.toString() 方法。
var reg = /d{2}/; reg.toString(); // "/d{2}/"字符串對象的方法 1. str.replace()
返回替換后的值
var reg = /d{2}/; var str = "1sss23sss456"; str.replace(reg,"?"); //"1sss?sss456"
常用于消除首尾空格:
var str = " abc def ggg "; str.replace(/^s+|s+$/g, ""); // "abc def ggg"
replace方法的第二個參數可以使用美元符號來指代所替換的內容:
> $& 指代匹配的子字符串。 > $` 指代匹配結果前面的文本。 > $" 指代匹配結果后面的文本。 > $n 指代匹配成功的第n組內容,n是從1開始的自然數。 > $$ 指代美元符號$。
replace方法的第二個參數還可以是一個函數,將每一個匹配內容替換為函數的返回值。這個函數可以接受多個參數,第一個參數是捕捉到的內容,第二個參數開始是捕捉到的組匹配(有多少個組匹配,就對應有多少個參數)。此外,最后還可以添加兩個參數,倒數第二個是捕捉到的內容在整個字符串中的位置,最后一個參數是原字符串。下面是一個網頁模板替換的例子:
var prices = { "pr_1": "$1.99", "pr_2": "$7.99", "pr_3": "$9.99", }; var template = ""; template.replace( /()()/, function(match, p1, p2, p3 ,p4) { return p1 + p2 + p3 + prices[p2] + p4; }); //$1.99
注意:第二個分組要加 ? 開啟懶惰模式,否則正則表達式默認的貪婪模式會匹配盡可能多的字符。貪婪模式下,上面的例子中第二個分組會匹配到pr_1">
與exec()的區別在于:當正則表達式加了g標識符時,結果不同。看栗子: 返回匹配的首字符的位置。 返回分割后的數組。 寫一個匹配手機號的正則(第一位是1,第二位是[3,4,5,7,8]中的一個,后面還有9位數字)var reg = /d{2}/g;
var str = "1sss23sss456";
reg.exec(str); //["23"]
str.match(reg); //["23","45"]
3.search()
var reg = /d{2}/;
var str = "1sss23sss456";
str.search(reg); //4
4.split()
var reg = /d{2}/;
var str = "1sss23sss456";
str.split(reg); //["1sss","sss","6"]
小練習
寫一個匹配 2017-01-01 或 2017/01/01 這兩種格式日期的正則表達式
————答案:
應用 1.使用正則改變數據結構/^1[34578]d{9}$/
/^d{4}[-/]d{2}[-/]d{2}$/
var re = /(w+)s(w+)/; var str = "John Smith"; var newstr = str.replace(re, "$2, $1"); console.log(newstr); //Smith, John2.在多行中使用正則表達式
var s = "Please yes make my day!"; s.match(/yes.*day/); // null s.match(/yes[^]*day/); //"yes make my day"3.從URL中提取子域名
var url = "http://xxx.domain.com"; console.log(/[^.]+/.exec(url)[0]); // "http://xxx" console.log(/[^.]+/.exec(url)[0].substr(7)); // "xxx"
匹配除了.之外的任意元素,一到多個字符。
“不會應用等于沒有學會”,熱烈歡迎小伙伴們在評論區補充平時用到正則表達式的地方,然后我會添加在文章里,一起收集吧 ヽ(??ω?? )ゝ參考:
1.正則表達式學習筆記
2.MDN RegExp文檔
3.實戰JS正則表達式
4.正則表達式30分鐘入門教程
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/82742.html
摘要:珍藏版收集了好幾年的書回過頭來一看真不少拿過來跟你們一起分享下載鏈接我也會在官網上發布視頻教程呀電影呀有用的資源你們懂得作者作者科技站長官網百度搜索科技博客公眾號搜索 珍藏版---收集了好幾年的書,回過頭來一看,真不少,拿過來跟你們一起分享 showImg(https://img-blog.csdnimg.cn/20181123115931741.png?x-oss-process=i...
摘要:珍藏版收集了好幾年的書回過頭來一看真不少拿過來跟你們一起分享下載鏈接我也會在官網上發布視頻教程呀電影呀有用的資源你們懂得作者作者科技站長官網百度搜索科技博客公眾號搜索 珍藏版---收集了好幾年的書,回過頭來一看,真不少,拿過來跟你們一起分享 showImg(https://img-blog.csdnimg.cn/20181123115931741.png?x-oss-process=i...
摘要:珍藏版收集了好幾年的書回過頭來一看真不少拿過來跟你們一起分享下載鏈接我也會在官網上發布視頻教程呀電影呀有用的資源你們懂得作者作者科技站長官網百度搜索科技博客公眾號搜索 珍藏版---收集了好幾年的書,回過頭來一看,真不少,拿過來跟你們一起分享 showImg(https://img-blog.csdnimg.cn/20181123115931741.png?x-oss-process=i...
摘要:使用看完你就會正則表達式了四種操作驗證切分提取替換第一章正則表達式字符匹配攻略正則表達式是匹配模式,要么匹配字符,要么匹配位置至少,至多匹配中的任一個字符范圍表示法如果要匹配則要么要么要么通配符,表示幾乎任意 API 使用 String#search String#split String#match String#replace RegExp#test Reg...
閱讀 2676·2021-11-16 11:53
閱讀 2737·2021-07-26 23:38
閱讀 2073·2019-08-30 15:55
閱讀 1751·2019-08-30 13:21
閱讀 3650·2019-08-29 17:26
閱讀 3306·2019-08-29 13:20
閱讀 875·2019-08-29 12:20
閱讀 3192·2019-08-26 10:21