JavaScript正則詳談

學過JavaScript的小夥伴應該都知道正則表達式，它簡直讓我們又愛又恨。
首先正則表達式是什麼？

正則表達式的概念

正則表達式(regular expression)是一個描述字符模式的對象。ECMAScript 的 RegExp 類，表示正則表達式，而 String 和 正則表達式都定義了進行強大的【模式匹配】和【文本檢索】與【替換】的函數。
它可以簡單地操作字符串，並完成一系列的操作，可以省下我們大量的時間和代碼，這邊是我們對它愛了的原因。
例如：如果正常操作字符串，找出字符串中的數字，需要將字符串遍歷，並一一比較每一個字符，將是數字的字符拿出來，比較麻煩；而是用正則表達式只需要一句語句就可以實現。

var arr = str.match(/\d+/g);
//str爲要查找的字符串

正則表達式的創建

說到創建，那肯定就是字面量方式和構造函數方式了，我們學過的數組、對象、字符串等等都是有這兩種方式創建的。

字面量方式：

var reg1 = /hello/ig;

構造函數方式

var reg2 = new RegExp("hello","ig"); 

我們一般常用的是使用字面量創建正則表達式，構造函數創建方式不常用。

正則表達式的使用

正則的方法

test方法：用來檢測字符串是否符合正則的標準

• 語法：正則.test(字符串)
• 返回值爲布爾類型
• test可以檢測字符串是否包含正則表達式的內容
• 如果檢測字符串是否爲某個字符串，可以在規則前加^,在規則後加$，表示開頭和結尾之間的內容

var str = "abcdefg";
var reg1 = /cd/;
var reg2 = /abcdefgh/;
var reg3 = /^cd$/;
console.log(reg1.test(str));//true
console.log(reg2.test(str));//true
console.log(reg3.test(str));//false

exec ：利用正則規則，在字符串之中進行匹配，並把匹配的結果返回回來

• 語法：正則.exec(字符串)
• 返回數組[要匹配的字符串，下標，在哪個字符串裏匹配，組]

var str = "abcdefg";
var reg1 = /cd/;
console.log(reg1.test(str));//["cd",index:2,input:"abcdefg",groups:"undefined"]

字符串的方法

search：查找字符串中是否有滿足正則條件的內容，相當於加強版的indexOf

• 語法：字符串.search(正則)
• 返回值：有的話返回滿足條件的索引，沒有返回-1

var str = "abcdefg";
var reg1 = /cd/;
var reg2 = /hi/;
console.log(str.search(reg1));//2
console.log(str.search(reg2));//-1

match：在字符串之中匹配符合規則的內容, 然後裝進一個新數組裏

• 語法：字符串.match(正則)
• 返回值 :
  如果只匹配了一個內容,那麼返回數組[要匹配的字符串，下標，在哪個字符串裏匹配，組]，如果match匹配到了多個內容，那麼這個時候直接返回匹配的字符串
• g：搜索全局，不加g，match之後搜索一個，效果和exec相同

var str = "abcdefgcdefgcde";
var reg1 = /cd/;
var reg2 = /cd/g;
console.log(str.match(reg1));//["cd",index:2,input:"abcdefg",groups:"undefined"]
console.log(str.match(reg2));["cd","cd","cd"]

replace：是將字符串中滿足正則條件的字符串換掉

• 語法：字符串.replace(正則，要替換的字符串)
• 返回值：替換後的字符串

var str = "abcdefgcdefgcde";
var reg1 = /cd/;
var reg2 = /cd/g;
console.log(str.replace(reg1,""));//abefgcdefgcde
console.log(str.replace(reg2,""));//abefgefge
console.log(str.replace(reg2,"*"));//ab*efg*efg*e

正則表達式的組成

元字符

• 正則表達式元字符是包含特殊含義的字符。它們有一些特殊功能，可以控制匹配模式的方式。

var reg = /[abcdef]/;

• 無論元字符裏有多少內容，只能表示一位的多種情況
• 元字符存在簡寫情況，比如/\w/表示數字字母下劃線，相當於/[a-zA-Z0-9_]/
  

限定符

• 我們又稱之爲量詞，表示數量

var reg = /[\d]{4,10}/;//表示數字0-9一共4-10位

邊界符

^：表示開頭
$：表示結尾
邊界符是限定字符串的開始和結束的

var reg3 = /^cd$/;//表示從c開始到d結束

特殊符號

標示符

我們又稱之爲修飾符，用來修飾規則

正則的應用

看到這裏，是不是突然明白了對正則的恨？
正則它可以簡化我的代碼，但是使得邏輯更加緊湊，是不是寫正則寫地頭昏腦漲？
別看它挺複雜，只要我們明白了邏輯，勤加練習，正則還不是得乖乖成爲我們手中的利器？
那麼學好正則，從我做起！