首頁 > 開發者 > JavaScript
Regex
Regex是一種模式比對的工具，它允許您以文字方式來表述模式，因而Regex成為了一個驗證文本資料的強大工具。除了模式比對之外，Regex還可以用於文字替換。從我在UNIX系統上使用Perl時第一次接觸到Regex開始，對Regex的支援就一直在不斷延伸。
注意：如果您身邊有很多其他的開發人員，Regex可能會被稱作RegEx或者RegExp。儘管Regex的功能強大，不過其文法有點“神秘”，需要花一些時間來掌握，下面就讓我們來看看使用Regex的一些基礎知識。
基本文法
Regex的文法可以應用得很複雜，甚至需要一整本書來講解這個題目，但是我將講解其中一部分基本知識來協助您擷取Regex的初步認識。
一個基本概念是錨(anchor)，它允許您指定字串的起點和終點，脫字元(^)用於指定字串的起點而貨幣符號($)則表示終點。如果需要在查詢字串中含有脫字元或者貨幣符號，您可以使用逸出序列來實現，逸出字元()是優先於脫字元或者貨幣符號之處理的。以下的例子會在單詞search在字串中出現時進行匹配。
^search$
而且，您還可以尋找一組字元，只要將它們放在方括弧中就行了，比如[ and ]，相匹配的字元必需屬於這個字元組，一個例子是在[12345]的範圍內尋找匹配的數字1到5，該Regex也可以寫作[1-5]。
很多時候您可能需要指定可以出現多次的字元，或者可選的字元，問號(?)的意思是該字元是可選的，加號(+)的意思是該字元可以出現一次或者多次，星號(*)的意思是該字元可以不出現或者出現多次。
現在讓我們來看看如何將這些簡單的Regex應用到JavaScript上。
JavaScript支援
JavaScript在1.2版本中添加了對Regex的支援，瀏覽器的支援則開始於Internet Explorer 4和Netscape 4，所有的Firefox 版本以及大多數現代瀏覽器都包含了JavaScript的支援。Regex可以通過JavaScript的字串和RegExp來使用。
使用字串
每個JavaScript字串都可以通過三種方法來支援Regex，這三種方法是match()、replace()和search()，而且對象的test() 方法還允許您進行測試。以下是關於match()、replace()和search()方法的資訊：
match(): 用於Regex匹配，如果多個匹配出現，則返回一個含有所有匹配結果的數組，數組中的每一個條目都是一份包含了匹配資料的拷貝；如果沒有匹配值，則返回空值。
replace(): 用於Regex匹配並將所有的匹配值替換為新的子字串，本方法的第一個參數是Regex，第二個參數是進行替換的字串。
search(): 用於在Regex與指定字串之間搜尋匹配值，如果出現匹配值，則返回字串的索引值，如果沒有匹配值，則返回-1。
JavaScript 還提供了RegExp對象來建立並使用Regex。
RegExp
RegExp對象包含了Regex的模式，該對象的方法和屬性可以用來匹配字串，有兩種方法可以用來建立RegExp對象的執行個體：使用建構函式或使用Regex文字模式的文字方式，第二個參數是可選的，該參數可以指定該搜尋是全域的(g)、忽略大小寫(i)或者全域同時忽略大小寫(gi)。以下的例子是使用建構函式建立RegExp對象的方法，在這個例子中，搜尋對象的大小寫是被忽略的： 複製代碼 代碼如下:testRegExp = new RegExp("^search$","I")
您可以使用文字方式來建立相同的執行個體(在斜杠中的部分)，如下所示： 複製代碼 代碼如下:testRegExp = /^search$/i
RegExp對象包含了大量的方法，但我們只介紹其中的一個方法test。該方法將對指定字串進行Regex匹配，如果成功則返回true，失敗則返回false，該方法可以應用在文字字串或者字串變數上，基本上，它允許您對一個字串進行Regex匹配，以下的例子示範了如何使用這個方法： 複製代碼 代碼如下:testRegExp = /search/i;
if (testRegExp.test("this is a search string") {
document.write("The string was found.");
} else {
document.write("No match found.");
}
We can place it in a Web page to test:
<html><head>
<title>RegExp test</title>
</head><body>
<script language="javascript">
testRegExp = /search/i;
if (testRegExp.test("this is a search string")) {
alert("The string was found.");
} else {
alert("No match found.");
}
</script></body></html>
實際操作
現在是講解更加完整的例子的時候了，在列表A中的網頁包含了JavaScript方法來驗證文字框中輸入的值，這段JavaScript代碼將搜尋包含我的姓氏和我的兩個名字的字串(忽略大小寫)，如果找到了我的名字，則通過字串對象的替換方法(search)將其替換為一個短名字。第二個文字框是用於接受時間值的，一個Regex在此對輸入的時間進行合法性驗證(數字是通過冒號分割的)。這個簡單的例子說明了如何在您的用戶端代碼中加入Regex來進行匹配和替換： 複製代碼 代碼如下:<html><head>
<title>RegExp validation</title>
<script language="JavaScript">
function validate() {
var doc = document.test;
varvalName = new RegExp("^(Tony|Anthony) Patton", "i");
if (doc.Name.value.match(valName) == null) {
alert("Name was not found.");
} else {
doc.Name.value = doc.Name.value.replace(valName, "T. Patton");
}
varvalTime = new RegExp("^([0-1][0-9]|[2][0-3]):([0-5][0-9])$");
if (doc.time.value.match(valTime) == null) {
alert("Please enter correct time format (hh:ss)");
} }
</script></head>
<body><form name="test">
Name: <input type="text" name="Name" value=""><br>
Time: <input type="text" name="time" value=""><br>
<input type="button" name="test" value="test" onClick="validate();">
</form></body></html>
強大而複雜
Regex的功能確實很強大，但是使用起來也並不簡單，因此，應當循序漸進地學習，當然，它確實值得您花上一些時間來學習如何正確使用。Regex為JavaScript (以及其他的語言)操作文本，通用軟體進行表單驗證提供了一個簡單而優雅的方法。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
