正則&highlight高亮實現(干貨)

寫完正則表達式以后在瀏覽器上檢測實在是不方便，於是就寫了一個JS正則小工具，大大地提高了學習效率。學習之余用正則實現了一個highlight高亮demo,歡迎交流。

什么是正則表達式？

簡單的說：正則表達式（Regular Expression）是一種處理字符串匹配的語言；

正則表達式描述了一種字符串匹配的模式，可以用來檢查一個字符串是否含有某種子串，對匹配到的子串進行“取出”或“替換”操作。

正則表達式的應用

正則表達式在實際的開發過程中非常實用，能夠快速解決一些復雜的字符串處理問題，下面我對正則表達式的應用做一些簡單分類：

第一種：數據驗證

比如，你要驗證一個字符串是否是正確的EMail，Telphone，Ip等等，那么采用正則表達式就好非常方便。

第二種：內容查找

比如，你要抓取一個網頁的圖片，那么你肯定要找到<img>標簽，這時候用正則表達式就可以精准的匹配到。

第三種：內容替換

比如，你要把手機號碼中間四位隱藏掉變成這種模式，123****4567，那么采用正則表達式也會非常方便。

正則表達式有哪些內容

1、正則表達式的幾個重要的概念

• 子表達式:在正則表達式中，如果使用"()"括起來的內容，稱之為“子表達式”
• 捕獲：子表達式匹配到的結果會被系統放在緩沖區中，這個過程，我們稱之為“捕獲”
• 反向引用：我們使用"\n"，其中n是數字，表示引用之前某個緩沖區之間的內容，我們稱之為“反向引用”

2、數量限定符

x+	表示：1或多個
x*	表示：0或多個
x?	表示：0或1個
x{n}	表示： n個
x{n,}	表示：至少n個
x{n,m}	表示：n至m個，貪婪原則，會盡可能匹配多個；如果在后面加個？,則為非貪婪原則

3、字符限定符

\d	表示：匹配一個數字字符，[0-9]
\D	表示：匹配一個非數字字符，[^0-9]
\w	表示：匹配包括下划線在內的單詞字符，[0-9a-zA-Z_]
\W	表示：匹配任何非單詞字符，[^0-9a-zA-Z_]
\s	表示：匹配任何空白字符，空格、回車、制表符
\S	表示：匹配任何非空白字符
.	表示：匹配任何單個字符

此外還有以下幾種：

范圍字符：	[a-z]、[A-Z]、[0-9]、[0-9a-z]、[0-9a-zA-Z]
任意字符：	[abcd]、[1234]
非在內的字符：	[^a-z]、[^0-9]、[^abcd]

 4、 定位符

^	表示：開頭標識
$	表示：結尾標識
\b	表示：單詞邊界
\B	表示：非單詞邊界

 5、轉義符


\	用於匹配某些特殊字符

 6、選擇匹配符

|

可以匹配多個規則

 7、特殊用法

?=	正向預查：匹配以指定內容結束的字符串
?!	負向預查：匹配不是以指定內容結束的字符串
?:	不把選擇匹配符的內容放到緩沖區

正則表達式在Javascript下的使用方法

在Javascript下使用正則表達式，有兩種方法:

第一種方法：使用RegExp類

提供的方法有：（正則表達式在前面）

test(str)	在字符串匹配是否有匹配模式的字符串，返回true/false
exec	如果正則表達式中有子表達式，使用exec方法時 //返回的是：result[0] = 匹配結果 , result[1] = 子表達式1的匹配結果 ……

第二種方法是：使用String類

提供的方法有：（正則表達式在后面）

search	返回匹配模式的字符串出現的位置，如果沒有，返回-1
match	返回匹配模式匹配到的字符串，如果有，返回數組，無，返回null
replace	將匹配模式匹配到的字符串進行替換
split	將字符串已匹配模式為分隔符進行字符串分隔，返回數組

總結

正則表達式就是我們實現某個功能的一個工具，這個工具：

1、功能強大

正則表達式中各種限定符的不同組合會實現不同的功能，有時實現一個復雜的功能需要編寫很長的正則表達式，如何能精准匹配，
這就要考驗一個程序員的能力了。

2、簡潔方便

平常我們在進行字符串內容查找，只能進行某個特定字符串的查找，但是正則表達式可以幫助我們進行模糊查找，更快更方便，
僅僅需要一個正則表達式串。

3、各種語言基本上都支持

目前如JAVA、PHP、Javascript、C#、C++等主流語言都支持正則表達式。

4、學習很簡單，應用很高深

學習正則表達式很快也很簡單，但是如何在實際開發中編寫出高效地，精准地正則表達式，還是需要長時間的嘗試和積累。