正則表達式詳解

一、基礎語法

用來處理字符串的規則

• 只能處理字符串的
• 它是一個規則：能夠驗證字符串是否符合某個規則，也能夠把字符串中符合規則的內容捕獲到

1.一、建立正則

使用一個正則表達式字面量，其由包含在斜槓之間的模式組成

var re = /\d+/;

調用RegExp對象的構造函數 ，兩個參數一個是元字符字符串，一個是修飾符字符串

var re = new RegExp("\\d+");

這兩種仍是有點語法區別

1. 構造函數由於傳遞的是字符串，\須要寫兩個才表明斜槓

正則表達式由兩部分構成

• 元字符（//在兩個斜槓中間的叫元字符）
• 修飾符

1.二、元字符

1.2.一、量詞元字符

設置出現的次數

元字符	含義
*****	零到屢次
+	1到屢次(在[]中就表明+號)
?	零或者1次
{n}	出現n次
{n,}	出現n到屢次
{n,m}	出現n到m次

1.2.二、特殊元字符

單個或者組合在一塊兒表明特殊含義的

元字符	含義
\	轉義字符
.	除\n(換行符)之外的任意字符
^	以哪個元字符做爲開始
$	以哪個元字符做爲結束
\n	換行符
\d	0-9之間的數字
\D	匹配一個非數字字符 （大寫和小寫的意思是相反的）
\w	數字，字母，下劃線中的任意一個字符
\s	一個空白字符（包含空格，製表符，換頁符等）
\t	一個製表符（一個TAB鍵：4個空格）
\b	匹配一個單詞的邊界
x|y	x或者y
[xyz]	x或者y或者z中的
[^xy]	除了x/y之外的任意字符
[a-z]	指定a-z這個範圍的任意字符
[^a-z]	除了小寫a-z的字符
（）	正則中的分組符號
（?:）	只匹配不捕獲
（?=）	正向預查
（?!）	負向預查

1.2.三、普通元字符

表明普通含義

/zhuzhe/ 只匹配zhuzhe

1.三、修飾符

符號	含義
i	忽略大小寫匹配
m	忽略換行匹配（多行匹配）
g	全局匹配

1.四、經常使用正則

var re= /[xy]/
re.test('xy') //true

var re= /^[xy]$/
re.test('xy') //false

//在[]裏面+號就表示普通的+號，可是\d在[]仍是0-9
var re=/^[@+]$/
re.test('+') //true

//[]中不存在多位數
var re=/^[10-29]$/  //這個並非表示10-29，表示1或者0-2或者9

經常使用的正則表達式

1.4.一、驗證是否爲有效數字

/*
*一、能夠出現+-號，也能夠不出現
 二、一位0-9均可以，多位首位不能爲0
 三、小數部分可能有可能沒有，一旦有後面必須有小數點+數字
 ? 0或者1
 + >=1次
 小數點要轉義
*/
var re=/^[+-]?(\d|([1-9]\d+))(\.\d+)?$/

1.4.二、驗證密碼

/*
*一、 數字，字母，下劃線
 二、 6-16位
 \w  數字，字母，下劃線中的任意一個字符
*/
var re=/^\w{6,16}$/

1.4.三、驗證真實姓名

/*
* 1. 尼古拉斯.趙四
  2. 名字長度2-10位，有譯文 .漢字
  漢字匹配 [\u4e00-\u9fa5]
*/
var re=/^[\u4e00-\u9fa5]{2,10}(.[\u4e00-\u9fa5]{2,10})*?$/  //這個.寫錯了

1.4.四、郵箱驗證

var reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/

1.4.五、身份證驗證

var reg=/^\d{17}(\d|X)$/

1.五、正則的捕獲

• 正則RegExp.prototype的方法
  • exec
  • test
• 字符串String.prototype上支持正則表達式處理的方法
  • replace
  • match
  • split
  • search
  • matchAll

1.5.一、 exec(正則方法）

**exec()**方法在一個指定字符串中執行一個搜索匹配。返回一個結果數組或 null。

index:當前捕獲內容在字符串的起始索引

input；原始字符串

正則捕獲的懶惰性：每執行一次只能捕獲到一個符合正則規則，可是默認狀況下，執行屢次獲取的結果永遠都是第一個匹配的，其餘的永遠匹配不到

當所有捕獲時，再次捕獲的結果是null

RegExpObject.exec(string)

• 實例1

  lastIndex:當前正則下一次匹配的起始索引位置（正則的屬性）,默認是0

  var str="I love antzone ,this is animate";
  var reg=/an/;
  console.log(reg.exec(str));
  /*
   ["an", index: 7, input: "I love antzone ,this is animate", groups: undefined]
  */
  
  var str="I love antzone ,this is animate";
  var reg=/an/g;
  var myArray;
  while ((myArray = reg.exec(str)) !== null) {
    var msg = 'Found ' + myArray[0] + '. ';
    msg += 'Next match starts at ' + reg.lastIndex;
    console.log(msg);
  }
  //Found an. Next match starts at 9
  //VM349:7 Found an. Next match starts at 26

• 實例二:

var str="I love antzone ,this is animate";
//這裏不加g，會死循環,否則每次都是從第一個開始捕獲
var reg=/an/g;
console.log(reg.exec(str));
//加了這句話，就能夠找完所用的 an
reg.lastIndex;
console.log(reg.exec(str));

/*
*["an", index: 7, input: "I love antzone ,this is animate", groups: undefined]
 ["an", index: 24, input: "I love antzone ,this is animate", groups: undefined]
*/

1.5.二、test(正則方法）

**test()** 方法執行一個檢索，用來查看正則表達式與指定的字符串是否匹配。返回 true 或 false。

var re=/an/;
 console.log(re.test('asada')) //fasle
 console.log(re.test('asanda')) //true

//是否在最開始
let str = 'hello world!';
let result = /^hello/.test(str);
console.log(result); 
// true

注意：test會改變正則表達式的lastIndex, (exec() 一樣改變正則自己的 lastIndex屬性值).

1.5.三、 match(字符串方法）

​ match() 方法檢索返回一個字符串匹配正則表達式的的結果

一、正則表達式不包含 g標誌，str.match() 將返回與 RegExp.exec(). 相同的結果。

二、用法都要加g,不加g就沒意義，

三、找不到返回null,找到返回找到值的數組

• 語法

  str.match(regexp)

• 實例

  var re = /\d/
  var str = "2018abc2019dad2020asas"
  console.log(str.match(re))
  //  ["2", index: 0, input: "2018abc2019dad2020asas", groups: undefined]
  
  var re = /\d/g
  var str = "2018abc2019dad2020asas"
  console.log(str.match(re))
  // ["2", "0", "1", "8", "2", "0", "1", "9", "2", "0", "2", "0"]
  
  var re = /\d+/g
  var str = "2018abc2019dad2020asas"
  console.log(str.match(re))
  //  ["2018", "2019", "2020"]
  
  var re = /an/g
  var str = "2018abc2019dad2020asas"
  console.log(str.match(re))
  // null

  "http:/www.baidu.com/?a=1&b=2".match(/([^?&=]+)=([^?&=]*)/g); //["a=1", "b=2"]

三、參考連接

JavaScript正則表達式總結

MDN 正則表達式

元字符及其含意完整例表

正則教學視頻