好程式設計師web前端培訓分享JavaScript學習筆記之正則

　　好程式設計師 web 前端培訓分享 JavaScript 學習筆記 之 正則 ， 正規表示式，又名 “規則表示式”

　　 由我們自己來書寫 “規則”，專門用來檢測   字串   是否符合 “規則” 使用的

　　 我們使用一些特殊的字元或者符號定義一個 “規則公式”，然後用我們定義好的 “規則公式” 去檢測字串是不是合格

var   reg   =   /\d+/ var   str1   =   '123' var   str2   =   'abc' console.log(reg.test(str1))   // true console.log(reg.test(str2))   // false

·  上面的變數  reg  就是定製好的規則

·  檢測  str1  這個字串的時候，符合規則

·  檢測  str2  這個字串的時候，不符合規則

建立一個正規表示式

·  想制定 “規則”，必須要按照人家要求的方式來制定

·  把一些字母和符號寫在  //  中間的東西，叫做正規表示式，比如  /abcdefg/

·  建立正規表示式有兩個方式  字面量  和  建構函式建立

字面量建立

// 下面就是字面量建立一個正規表示式 var   reg   =   /abcdefg/

·  這個正規表示式就可以去檢測字串了

建構函式建立

// 下面就是建構函式建立一個正規表示式 var   reg   =   new   RegExp ( 'abcdefg' )console.log(reg)   //  /abcdefg/

·  使用建構函式方式建立的和字面量建立的，得到的結果一樣

正規表示式裡面的符號

·  知道了怎麼建立一個正規表示式以後，我們就來詳細的說一下正規表示式裡面涉及到的一些符號了

元字元

·  .  ： 匹配非換行的任意字元

·  \  ： 轉譯符號，把有意義的  符號  轉換成沒有意義的  字元 ，把沒有意義的  字元  轉換成有意義的  符號

·  \s  ： 匹配空白字元（空格/製表符/...）

·  \S  ： 匹配非空白字元

·  \d  ： 匹配數字

·  \D  ： 匹配非數字

·  \w  ： 匹配數字字母下劃線

·  \W  ： 匹配非數字字母下劃線

 

·  有了元字元我們就可以簡單的制定一些規則了

var   reg   =   /\s/ var   str   =   'a b' var   str2   =   'ab' console.log(reg.test(str))   // true console.log(reg.test(str2))   // false var   reg   =   /\d/ var   str   =   'abc1' var   str2   =   'abc' console.log(reg.test(str))   // true console.log(reg.test(str2))   // false var   reg   =   /\w/ var   str   =   'a1' var   str2   =   '#@$' console.log(reg.test(str))   // true console.log(reg.test(str2))   // false

限定符

·  *  ： 前一個內容重複至少 0 次，也就是可以出現  0 ～ 正無窮  次

·  +  ： 前一個內容重複至少 1 次，也就是可以出現  1 ～ 正無窮  次

·  ?  ： 前一個內容重複 0 或者 1 次，也就是可以出現  0 ～ 1  次

·  {n}  ： 前一個內容重複 n 次，也就是必須出現  n  次

·  {n,}  ： 前一個內容至少出現 n 次，也就是出現  n ～ 正無窮  次

·  {n,m}  ： 前一個內容至少出現 n 次至多出現 m 次，也就是出現  n ～ m  次

 

·  限定符是配合元字元使用的

// 下面正則表示驗證數字出現 0 ～ 正無窮次都可以 var   reg   =   /\d*/ var   str   =   'abc' var   str2   =   'abc1' var   str3   =   'abc123' console.log(reg.test(str))   // true console.log(reg.test(str2))   // true console.log(reg.test(str3))   // true// 下面正則表示驗證數字出現 1 ～ 正無窮次都可以 var   reg   =   /\d+/ var   str   =   'abc' var   str2   =   'abc1' var   str3   =   'abc123' console.log(reg.test(str))   // false console.log(reg.test(str2))   // true console.log(reg.test(str3))   // true// 下面正則表示驗證數字出現 0 ~ 1 次都可以 var   reg   =   /\d?/ var   str   =   'abc' var   str2   =   'abc1' console.log(reg.test(str))   // true console.log(reg.test(str2))   // true// 下面正則表示驗證數字必須出現 3 次 var   reg   =   /\d{3}/ var   str   =   'abc' var   str2   =   'abc1' var   str3   =   'abc123' console.log(reg.test(str))   // false console.log(reg.test(str2))   // false console.log(reg.test(str3))   // true// 下面正則表示驗證數字出現 3 ～ 正無窮次 var   reg   =   /\d{3,}/ var   str   =   'abc' var   str2   =   'abc1' var   str3   =   'abc123' var   str4   =   'abcd1234567' console.log(reg.test(str))   // false console.log(reg.test(str2))   // false console.log(reg.test(str3))   // true console.log(reg.test(str4))   // true// 下面正則表示驗證數字只能出現 3 ～ 5 次 var   reg   =   /\d{3,5}/ var   str   =   'abc' var   str2   =   'abc1' var   str3   =   'abc123' var   str4   =   'abc12345' console.log(reg.test(str))   // false console.log(reg.test(str2))   // false console.log(reg.test(str3))   // true console.log(reg.test(str4))   // true

邊界符

·  ^  ： 表示開頭

·  $  ： 表示結尾

 

·  邊界符是限定字串的開始和結束的

// 下面表示從開頭到結尾只能有數字，並且出現 3 ～ 5 次 var   reg   =   /^\d{3,5}$/ var   str   =   'abc' var   str2   =   'abc123' var   str3   =   '1' var   str4   =   '1234567' var   str5   =   '123' var   str6   =   '12345' console.log(reg.test(str))   // false console.log(reg.test(str2))   // false console.log(reg.test(str3))   // false console.log(reg.test(str4))   // false console.log(reg.test(str5))   // true console.log(reg.test(str6))   // true

特殊符號

·  ()  ： 限定一組元素

·  []  ： 字符集合，表示寫在  []  裡面的任意一個都行

·  [^]  ： 反字符集合，表示寫在  [^]  裡面之外的任意一個都行

·  -  ： 範圍，比如  a-z  表示從字母 a 到字母 z 都可以

·  |  ： 或，正則裡面的或  a|b  表示字母 a 或者 b 都可以

 

·  現在我們就可以把若干符號組合在一起使用了

// 下面是一個簡單的郵箱驗證// 非_$開頭，任意字元出現至少6次，一個@符號，(163|126|qq|sina)中的任意一個，一個點，(com|cn|net)中的任意一個 var   reg   =   /^[^_$].{6,}@(163|126|qq|sina)\.(com|cn|net)$/

標示符

·  i  ： 表示忽略大小寫

·  這個 i 是寫在正則的最後面的

·  /\w/i

·  就是在正則匹配的時候不去區分大小寫

 

·  g  ： 表示全域性匹配

·  這個 g 是寫在正則的最後面的

·  /\w/g

·  就是全域性匹配字母數字下劃線

正規表示式的方法

·  正則提供了一些方法給我們使用

·  用來檢測和捕獲字串中的內容的

test

·  test  是用來檢測字串是否符合我們正則的標準

·  語法：  正則.test(字串)

·  返回值： boolean

console.log( /\d+/ .test( '123' ))   // true console.log( /\d+/ .test( 'abc' ))   // false

exec

·  exec  是把字串中符合條件的內容捕獲出來

·  語法：  正則.exec(字串)

·  返回值： 把字串中符合正則要求的第一項以及一些其他資訊，以陣列的形式返回

var   reg   =   /\d{3}/ var   str   =   'hello123world456你好789' var   res   =   reg.exec(str)console.log(res) /* ["123", index: 5, input: "hello123world456你好789", groups: undefined]    0: "123"    groups: undefined    index: 5    input: "hello123world456你好789"    length: 1  __proto__: Array(0)*/

·  陣列第 0 項就是匹配到的字串內容

·  index 屬性表示從字串的索引幾開始是匹配的到字串

字串的方法

·  字串中有一些方法也是可以和正則一起使用的

search

·  search  是查詢字串中是否有滿足正則條件的內容

·  語法：  字串.search(正則)

·  返回值 ： 有的話返回開始索引，沒有返回 -1

var   reg   =   /\d{3}/ var   str   =   'hello123' var   str2   =   'hello' console.log(str.search(reg))   // 5 console.log(str2.search(reg))   // -1

match

·  match  找到字串中符合正則條件的內容返回

·  語法：  字串.match(正則)

·  返回值 ： 

·  沒有標示符 g 的時候，是和 exec 方法一樣

·  有標示符 g 的時候，是返回一個陣列，裡面是匹配到的每一項

var   reg   =   /\d{3}/ var   str   =   'hello123world456' var   str2   =   'hello' console.log(str.match(reg))   // ["123", index: 5, input: "hello123wor456", groups: undefined] console.log(str2.match(reg))   // null var   reg   =   /\d{3}/g var   str   =   'hello123world456' var   str2   =   'hello' console.log(str.match(reg))   // ["123", "456"] console.log(str2.match(reg))   // null

replace

·  replace  是將字串中滿足正則條件的字串替換掉

·  語法：  字串.replace(正則，要替換的字串)

·  返回值 ： 替換後的字串

var   reg   =   /\d{3}/ var   str   =   'hello123world456' var   str2   =   'hello' console.log(str.replace(reg))   // hello666world456 console.log(str2.replace(reg))   // hello var   reg   =   /\d{3}/g var   str   =   'hello123world456' var   str2   =   'hello' console.log(str.replace(reg))   // hello666world666 console.log(str2.replace(reg))   // hello