正則表達式之初入江湖

caige 發(fā)布于2019-08-26 17:22 / 1696人閱讀

摘要：拿舉例子只想說明你總會在一些陰暗的角落遇到正則表達式，為了到時候不至于一頭霧水，我們最好簡單的了解一下正則表達式的使用。

為什么要學(xué)正則表達式

很多人對正則表達式的認(rèn)知只是在進行表單驗證的時候在網(wǎng)上搜一段正則表達式進行copy，實際工作上好像很難遇到大段的正則表達式

我第一次看到大量的正則使用是在jQuery源碼中，當(dāng)時看的頭疼只好草草的看下大概思路不了了之，但是到今天我依然不認(rèn)為這種做法是錯誤的，jQuery早期為了兼容性代碼很多地方太臟，不如在網(wǎng)上搜搜源碼架構(gòu)。拿jQuery舉例子只想說明你總會在一些陰暗的角落遇到正則表達式，為了到時候不至于一頭霧水，我們最好簡單的了解一下正則表達式的使用。

看完本文你不會稱為正則專家，實際你也不需要精通正則，能看懂別人寫的正則和能寫一些簡單的正則即可

之前在網(wǎng)上搜過一些文章，感覺寫的都不太好把我的耐心都磨沒了所以我決定寫一篇符合“人”學(xué)習(xí)直覺的文章

創(chuàng)建正則表達式

在JavaScript中與大多數(shù)其他對象類型一樣，有兩種方法可以創(chuàng)建正則表達式比如我們要匹配一個"test"字符串

通過正則表達式字面量

var pattern = /test/;

通過構(gòu)造RegExp實例

var pattern = new RegExp("test");

前者直接在//中寫匹配規(guī)則就Ok了，后者需要調(diào)用RegExt構(gòu)造方法，并把匹配規(guī)則用""包起來，很明顯第一種更加清晰，反正我每次都記不住"RegExp"，每次用都要現(xiàn)查，所以我們接下來用第一種就好了（RegExp有它的好處但是目前不需要知道）

現(xiàn)在你一定想知道/test/表達的是什么意思？

這種一個接一個的字符，隱式的表達了"followed by"這樣一個操作也就是一個挨著一個

"t"后面跟著"e"

"e"后面跟著"s"

"s"后面跟著"t"

正則表達式的威力僅此而已嗎？如果只是這樣就太讓人失望了，因為完全可以使用indexOf進行判斷

接下來我們額外學(xué)習(xí)三個英文字母，在正則中他們有各自的含義

i 讓正則表達式不分大小寫 /test/i 表示不僅可以匹配"test"還可以匹配"TeSt"

g 全局匹配默認(rèn)情況正則只匹配第一次出現(xiàn)的結(jié)果比如"testkdgyitest" 找到第一個"test"就算完成工作了，而g可以找到所有符合條件的匹配值

m 允許匹配多個行比如匹配textarea中的值

請記住這些字母跟在//后面如/test/i

接下來讓我們做個小練習(xí)，有如下字符串，將字符串中的test(不區(qū)分大小學(xué))替換成“啊哈正則” 提示：js替換字符串常用replace方法并且replace第一個參數(shù)接收正則表達式

var str =  "sjufhsufhTesT";//將test（不論大小寫）替換成“啊哈正則”

答案：

var str =  "sjufhsufhTesT";
var pattern = /test/i;
var newStr = str.replace(pattern, "啊哈正則");

前面說了默認(rèn)情況正則只匹配第一次出現(xiàn)的結(jié)果，我們來測試一下

var str =  "testsjufhsufhTesT";
var pattern = /test/i;
var newStr = str.replace(pattern, "啊哈正則");// 結(jié)果如下"啊哈正則sjufhsufhTesT"

我們加上g試試

var str =  "testsjufhsufhTesT";
var pattern = /test/ig;
var newStr = str.replace(pattern, "啊哈正則");// 結(jié)果如下"啊哈正則sjufhsufh啊哈正則"

匹配一類字符

有時候我們想更靈活一些，不想只匹配某個特定的字符串，而是想匹配集合中的某一個字符，比如我們只想匹配“a” “b” “c”中任何一個字符我們可以這么寫[abc]

[]中可以指定一個集合比如[abc]，那么如果想指定一個從a到z的集合，難道我們把26個英文字母一個一個寫一遍嗎？當(dāng)然不需要！我們可以在[]中指定范圍[a-z]

沒懂？看下面的例子就好了

var str1 = "ak恩ebc";
var pattern1 = /[abc]/;
var newStr1 = str1.replace(pattern1,"雅兒");
console.log(newStr1);//雅兒k恩ebc
我們看到我們想要abc之中的任何一個字符，即使中間隔著其他字符也沒關(guān)系，但是默認(rèn)情況是如果找到了a就停止往下繼續(xù)匹配b和c了，如果沒匹配到a，那么將匹配b，以此類推

如果想全部匹配請加上在//后加上"g"

現(xiàn)在有個新需求，匹配除abc之外的字符，我們怎么辦呢？可以在集合中插入一個"^" ¹

"^" 表示除...之外

var str2 = "ak恩ebc";
var pattern2 = /[^abc]/g;
var newStr2 = str2.replace(pattern2,"雅兒")
console.log(newStr2);//a雅兒雅兒雅兒bc

各位看客看到這里想必也累了，余下的內(nèi)容以后再說。先把這次的內(nèi)容復(fù)習(xí)一下

正則表達式的兩種創(chuàng)建方式

i g m 三個字母代表的特殊含義 i表示不區(qū)分大小寫 g表示全局匹配 m表示允許匹配多個行（別忘了寫在//后如/test/i）

可以用[]匹配集合中的某個字符串

可以^實現(xiàn)反選，表示除...之外

最后推薦一個正則可視化工具，可以在上面練習(xí)正則，通過可視化的方式更輕松的理解

https://regex101.com/

abc ?

云服務(wù)器 GPU云服務(wù)器正則正則表達式正則匹配正則表達式 -正則表達式正則表達式?

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/110135.html

發(fā)表評論

登陸后可評論

0條評論

caige

男|高級講師

我要關(guān)注我要私信

TA的文章

二、Rdeis Jedis

閱讀 3100·2021-11-22 09:34
《C語言入門》掃雷小游戲C語言實現(xiàn)

閱讀 604·2021-11-22 09:34
Hostodo十月促銷：$45/年KVM-3GB/30G NVMe/5TB/三個機房

閱讀 2453·2021-10-08 10:18
糖果主機如何備案-域名沒主機怎么備案？

閱讀 3387·2021-09-22 15:57
云虛擬主機如何管理-虛擬主機怎么登陸圖解？

閱讀 2598·2021-09-22 15:25
圖標(biāo)文字對齊的幾種常見方法

閱讀 2413·2019-08-30 15:54
面試官: "用css實現(xiàn)android系統(tǒng)的loading動畫"

閱讀 2126·2019-08-30 15:44
js獲取字符串的字節(jié)數(shù)(適合用于多行文字省略號)

閱讀 1806·2019-08-29 11:18

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

正則表達式之初入江湖

很多人對正則表達式的認(rèn)知只是在進行表單驗證的時候在網(wǎng)上搜一段正則表達式進行copy，實際工作上好像很難遇到大段的正則表達式

看完本文你不會稱為正則專家，實際你也不需要精通正則，能看懂別人寫的正則和能寫一些簡單的正則即可

之前在網(wǎng)上搜過一些文章，感覺寫的都不太好把我的耐心都磨沒了所以我決定寫一篇符合“人”學(xué)習(xí)直覺的文章

在JavaScript中與大多數(shù)其他對象類型一樣，有兩種方法可以創(chuàng)建正則表達式比如我們要匹配一個"test"字符串

現(xiàn)在你一定想知道/test/表達的是什么意思？

這種一個接一個的字符，隱式的表達了"followed by"這樣一個操作也就是一個挨著一個

正則表達式的威力僅此而已嗎？如果只是這樣就太讓人失望了，因為完全可以使用indexOf進行判斷

接下來我們額外學(xué)習(xí)三個英文字母，在正則中他們有各自的含義

請記住這些字母跟在//后面 如/test/i

接下來讓我們做個小練習(xí)，有如下字符串，將字符串中的test(不區(qū)分大小學(xué))替換成“啊哈正則” 提示：js替換字符串常用replace方法并且replace第一個參數(shù)接收正則表達式

答案：

前面說了默認(rèn)情況正則只匹配第一次出現(xiàn)的結(jié)果，我們來測試一下

我們加上g試試

有時候我們想更靈活一些，不想只匹配某個特定的字符串，而是想匹配集合中的某一個字符，比如我們只想匹配“a” “b” “c”中任何一個字符 我們可以這么寫[abc]

[]中可以指定一個集合比如[abc]，那么如果想指定一個從a到z的集合，難道我們把26個英文字母一個一個寫一遍嗎？當(dāng)然不需要！我們可以在[]中指定范圍[a-z]

沒懂？看下面的例子就好了

現(xiàn)在有個新需求，匹配除abc之外的字符，我們怎么辦呢？可以在集合中插入一個"^" 1