JavaScript學習1：Regex，

JavaScript學習1：Regex，

        其實在學習JavaScript之前就知道Regex的概念，記得第一次聽說是在學習專業課的時候，那門課程叫做《形式語言與自動機理論》，到現在我還清楚的記得當時學這門課程的時候，那種痛苦，一個學期學下來，根本不知道這門課到底在講什麼，有什麼用？

        後來在準備軟考的時候，又一次的接觸到了這塊的內容，終於是知道了，這門課通篇都在介紹一種叫做文法的東西，喬姆斯基體系將文法分為了四類，分別是0型文法（短語文法）、1型文法（上下文有關文法）、2型文法（上下文無關文法）和3型文法（正則文法），而我們今天要談到的是正則文法產生運算式，即為Regex。

        什麼是Regex？

        RE（RegularExpression）是一個描述字元模式的對象。在JavaScript中的RegExp類表示Regex，而String和RegExp都定義了使用Regex進行強大的模式比對和文本檢索與替換的函數。

        為什麼使用Regex？

        假設使用者需要在HTML表單中填寫姓名、地址、出生日期等資訊，那麼在將表單提交到伺服器做進一步處理之前，JavaScript程式會檢查表單以確認使用者的輸入是合法有效。而程式中的Regex主要用來驗證用戶端輸入的資料，是否符合要求，這樣做可以節約大量的伺服器端的系統資源，提高系統效能，並且提供了更好的使用者體驗。

        如何使用Regex？

        在JavaScript中有兩種建立Regex的方式，一種是採用new運算子，另一個是採用字面量的方式。

        使用new運算子建立

        Varstr=new RegExp（’模式字串’,’模式修飾符（可有可無）’）;

        使用字面量方式建立

        Varstr=/模式字串/模式修飾符;

        這個模式修飾符是一個選擇性參數，主要有以下幾種

 

        建立完之後，就要使用Regex了，RegExp對象包含兩個方法：text()和exec()，功能基本相似，用於測試字串匹配。Test()方法在字串中尋找是否存在指定的Regex並返回布爾值。Exec()方法也是尋找指定的Regex，如果執行成功，返回包含該尋找字串的相關資訊數組，否則返回null。

        瞭解了以上的基礎知識後，接下來我們就要進階了，Regex元字元是包含特殊含義的字元，它們有一些特殊功能，可以控制匹配模式的方式，反斜線後的元字元將失去其特殊含義，我們越來越像實際使用中靠近了。下面我介紹最常用的字元類，如下：

  

        當然還有其他的字元類，比如空白字元、錨字元、替代字元和記錄字元等，這裡不再多做介紹，下面我們來看看如何使用字元類去自己編寫Regex，完成我們想要的驗證。

        先來做個手機號碼的驗證運算式

<span style="font-size:18px;"><span style="font-size:18px;"></span>

<span style="font-size:18px;">var pattern=/[1][0-9]{10}/;var tel='18890089706';if(!pattern.test(tel))alert('請輸入正確的手機號碼！');</span></span>

        最後我們利用剛學到的知識，做一個驗證郵箱地址的函數     

<span style="font-size:18px;"><span style="font-size:18px;"></span>

<span style="font-size:18px;">function VerifyMail(mail){var pattern =/^([\w\.\-]+)@([\w\-]+)\.([a-zA-Z]{2,4})$/;var str=mail;if (pattern.test(str))alert('您輸入的郵箱正確無誤！');elsealert('對不起！請您輸入合法的郵箱地址！');};//調用函數驗證郵箱是否正確VerifyMail('jaidfjai@qq.com');</span></span>

        小結：JavaScript的學習是非常重要的，之所以總結Regex的內容，一個是因為以前覺得這個東西很神奇，不是很理解，再者是因為這個很重要，在做Web開發時，表達提交是家常便飯，那麼提交內容的驗證就隨之而來，我們總不能把所以的驗證操作都交給伺服器吧，那樣效率大大滴不好啊。