1. 程式人生 > >從零開始的全棧工程師——js篇(正則表示式)

從零開始的全棧工程師——js篇(正則表示式)

正則 就是一條規則 用來檢驗字串的格式 目標就是字串

只要是通過表單提交的資料 都是字串
1.正則定義
var reg = new RegExp( )
var reg = /格式/ <--簡寫

 

2.正則的方法
兩大功能:一個是匹配 匹配成功就是true 第二個是捕獲 如果有就拿出來
test( ) 用於匹配
exec( ) 用於捕獲 直接返回捕獲的物件 沒捕獲到就是null

 

3.正則修飾符 如何去匹配
①區不區分大小寫 “i”代表忽略大小寫
②全域性 “g”代表全域性匹配
③“m”代表多行匹配

 

4.修飾符使用方法:
var reg = new RegExp("hello",g)


var reg = /hello/g <-- 簡寫

 

5.字串中有關正則的方法 跟正則有關
①match( ) 查詢一個或多個與正則相匹配的文字 有返回值就是查詢的結果 沒有就是null
②search( ) 匹配和正則相同的字元 有就返回索引 沒有就是-1
③replace( ) 匹配與正則相同的 並替換掉 返回結果是替換後的字串 -->st.replace("hello","hahaha")

 

 

6.正則的方括號[ ]
[abc] 代表查詢方括號中的任何字元
[^abc] 代表查詢任何一個不在方括號之間的字元
[0-9] 查詢任何從0到9的數字
[a-z] 查詢任何從小寫 a 到小寫 z 的字元


[A-Z] 查詢任何從大寫 A 到大寫 Z 的字元
[A-z] 查詢任何從大寫 A 到小寫 z 的字元
[adgk] 查詢給定集合內的任何字元
[^adgk] 查詢給定集合外的任何字元
(red|blue|green) 查詢任何指定的選項

 

7.元字元
. 代表單個字元
\w 代表單詞字元 包含了數字 字母 下劃線
\W 代表非單詞字元 除了數字 字母 下劃線
\d 代表數字
\D 代表非數字
\s 代表空白字元
\S 代表非空白字元
\b 匹配單詞邊界 -->字串兩端必須是單詞
\B 匹配非單詞邊界
\0 代表null字元

 

8.量詞
n+ 代表至少 1 個n的字元
n* 代表 0 個或多個n


n? 代表包含 0 個或 1 個n
n{x} 代表包含 x 個n
n{x,} 代表包含至少x個n
n{x,y} 代表大於等於x個小於等於y個n
n$ 代表包含以n結尾的字串
^n 代表包含以n開頭的字串
?=n 指定字串後面緊跟的n的字串 返回結果不帶n
↓↓
var str="Is this all there is";
var patt1=/is(?= all)/; //返回is

^ <-- 尖角號

 

 

正則的理解:

1.正則的懶惰性

每一次在exec( ) 中捕獲的時候 只捕獲第一次匹配的內容 而不往下捕獲了 我們把這種功能叫正則的懶惰性
每一次捕獲的開始位置都是從 0 開始
解決正則的懶惰性 -- > 在正則後面加個g 並且控制檯輸出多次

 

2.正則的貪婪性
每一次匹配都是按照最長的出結果 我們把這種功能叫正則的貪婪性

解決正則的貪婪性 -- > 在元字元量詞後面加 ? 號 / \d+? /g

 

 

正則的捕獲
1.普通捕獲exec( ) < -- > 2.match( ) 就是對exec的一個包裝
普通捕獲有懶惰性 給正則新增一個修飾符g可以解決 match 是將所有捕獲的內容放到一個數組中並返回
match就是對exec的一個簡單的封裝

3.分組捕獲 捕獲的方法還是exec( ) 和 match( ) 正則在結構上發生了變化 加( )了
例子:var reg = / (a) (b) / -- > 返回ab a b
非全域性下:
exec( )和match( )在非全域性下分組捕獲是相同的 在捕獲的過程中即捕獲大正則裡的內容
也捕獲分組中的內容 並都返回

全域性下:
例子:var reg = / (a) (b) /g -- > exec返回ab a b match返回ab
exec( )和match( )在全域性下的分組捕獲是不一樣的 exec( )不變 但是match( )只捕獲大正則裡的內容

 

4.分組捕獲的優勢
①可以提升優先順序
②可以捕獲引用
\1 代表分組1裡面的內容 \2 代表分組2裡面的內容
前提是分組必須在引用之前 如果 \2 在分組的前面代表普通的表示式

 

5.分組的結果存在正則類 RegExp 和 $number 屬性下
\1 和 RegExp.$1 二者都是分組引用
\1 只能使用在正則表示式裡面 RegExp.$1可以外面使用 都是在捕獲完成的條件下

 

6.在捕獲的過程中怎麼取消捕獲分組中的內容
在分組的前面加上 ?: 就可以了
?:和?=的區別
?:就是取消分組中的內容的
而?= 例子:var reg = /a(?=b)/ var st = "ab" 捕獲字元a後面緊跟b的 並且只返回a

 

replace
replace是字串的一個方法 他有兩個引數 用後者將前者替換掉 並返回一個新的字串 但是沒有改變原字串
1.如果第一個引數是字串 只改變一次
2.如果第一個引數是正則 捕獲一次改變一次
3.如果第二個引數是匿名函式 每捕獲一次 執行一次 return的是什麼 那就替換什麼
這個匿名函式的arguments有三個元素

replace案例1: "beiwangbeiwang123beiwang"  -- > "nanwangnanwang123nanwang"

 

 replace案例2:日期格式 "12.19/2019"  -- > "2019-12-19"

 

 

 replace案例3:遮蔽關鍵字 "雙十一是京東的活動"  -- > " ***是京東的** "

 

 

正則小案例:

案例1: 寫一個12到65週歲的正則 var reg = /^(1[2-9])|([2-5][0-9])|(6[0-5])$/ var st = "65" console.log(reg.test(st))
案例2:正常輸入一個數字 var reg = /^[+-]?([0-9]|[1-9]\d+)(\.\d+)$/ var st = '60' console.log(reg.test(st))
案例3:qq郵箱 var reg = /^([1-9]\d{4,9})@(qq.com)$/ var st = "[email protected]" console.log(reg.test(st))
案例4:網易郵箱 (6-18個字元 w 必須以字母開頭) @ 163/126.com/yeah.net var reg = /^([A-Za-z](\w|-){5,17})@((163|126)\.com)|(yeah.net)$/ var st = "[email protected]" console.log(reg.test(st))