程式語言教學誌 FB, YouTube: PYDOING: JavaScript 快速導覽

RegExp 物件 (object) 為正規表示式 (regular expression) 的物件，所謂的正規表示式為具有特殊語法規則的字串 (string) ，可用於比對其他字串中相符的格式字串，便於搜尋及替換。例如以下字串

var stest = "Ask and it will be given to you; seek and you will find; knock and the door will be opened to you. Matthew 7:7"

這句話出自聖經，如果我們要搜尋出自聖經的哪個章節，正規表示式的物件變數如下

var rtest = /\w* \d*:\d*/;

這是正規表示式的字面常數 (literal) ，兩個斜線範圍即是正規表示式。由於聖經的章節字串利用為 "Matthew 7:7" ，格式會重複出現的有文字、數字、分號及數字。

\w 表示任意文字的字元，後面緊接的星號表示 \w 可以有任意個，因此 \w* 就是代表連續沒有空格的一組文字字元，這裡 "Matthew" 符合這樣的規則，同樣的， "馬太福音" 也符合這樣的規則。

\w* 後空一格，表示其後有一個空白符號。其後再接 \d* ， \d 表示任意數字的字元，這裡的數字必須是 0 到 9 任一個，所以 \d* 表示任意長度的數字，可以是一位數、兩位數或更多位數。

後面沒有空格緊接冒號，再接一組 \d* ，最後以斜線結尾。

雖然直接看字串是 Matthew 7:7 ，然而很多時候處理資料用肉眼逐一檢視每個字串的細節是相當費時、費力的，因此利用正規表示式可以有效搜尋、替換、處理字串。

基本 RegExp 物件的字面常數格式如下

var patt=/pattern/modifiers;

pattern 即是正規表示式的樣式 (pattern)， modifiers 則是修飾詞 (modifier) ，屬於額外的標記符號，有 i 、 g 兩個， i 表示區分大小寫， g 表示範圍為全域。

RegExp 物件有以下的屬性 (attribute)

屬性	描述
source	字串形式
global	記錄是否有 g 修飾詞
ignoreCase	記錄是否有 i 修飾詞

另有以下常用的方法 (method)

方法	描述
toString()	回傳物件的字串形式
exec(string)	測試 string 中是否有符合正規表示式的子字串，如果有，就回傳該子字串
test(string)	測試 string 中是否有符合正規表示式的子字串，如果有，就回傳 true

舉例示範如下

function run() {
    var c = document.getElementById("content");
    var n1 = document.createElement("p"); 
    var n2 = document.createElement("p"); 
    var n3 = document.createElement("p"); 
    var n4 = document.createElement("p");
    var n5 = document.createElement("p");
    var n6 = document.createElement("p");
    var n7 = document.createElement("p");
    var n8 = document.createElement("p");
    
    var stest1 = "Ask and it will be given to you; seek and you will find; knock and the door will be opened to you. Matthew 7:7"
    var stest2 = "你們祈求，就給你們；尋找，就尋見；叩門，就給你們開門。 馬太福音 7:7"
    var t1 = /[A-Z]\w* \d*:\d*/;
    var t2 = t1.test(stest1);
    var t3 = t1.test(stest2);
    var t4 = t1.source;
    var t5 = t1.global;
    var t6 = t1.ignoreCase;
    var t7 = t1.multiline;
    var t8 = t1.lastIndex;
    
    n1.appendChild(document.createTextNode(t1));
    c.appendChild(n1);
    n2.appendChild(document.createTextNode(t2));
    c.appendChild(n2);
    n3.appendChild(document.createTextNode(t3));
    c.appendChild(n3);
    n4.appendChild(document.createTextNode(t4));
    c.appendChild(n4);
    n5.appendChild(document.createTextNode(t5));
    c.appendChild(n5);
    n6.appendChild(document.createTextNode(t6));
    c.appendChild(n6);
    n7.appendChild(document.createTextNode(t7));
    c.appendChild(n7);
    n8.appendChild(document.createTextNode(t8));
    c.appendChild(n8);
}


/* 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名：reg01.js
     功能：示範 JavaScript 程式 
     作者：張凱慶
     時間：西元 2010 年 11 月 */

利用以下的 HTML 文件開啟

<html>

<head>
<title>JavaScript Demo</title>
<script src="reg01.js" type="text/javascript"></script>
</head>

<body>
<input id="b" type="button" value="RUN" onclick="run();">
<div id="content"></div>
</body>

</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名：reg01.html
     功能：示範 JavaScript 程式 
     作者：張凱慶
     時間：西元 2010 年 11 月 -->

執行結果如下