JavaScript基礎之正則表示式
技術標籤:Javascriptjavascript
1.概念
正則表示式(Regular Expression)是用於描述一組字串特徵的模式,用來匹配特定的字串。通過特殊字元+普通字元來進行模式描述,從而達到文字匹配目的工具。
正則表示式目前被整合到了各種文字編輯器/文字處理工具當中
2.建立方式
(1) 字面量建立
var reg = /day/ig;
(2) 建構函式建立
var reg = new RegExp("day","ig");
3.語法
(1) 規則(表示式) 寫在//之間
2.修飾符i (忽略大小寫)g (全域性匹配(匹配整個字串多次,也稱為貪婪模式
// 沒有加忽略大小寫 var str = "good good study , Day dAy up"; var reg = /day/; var result = str.search(reg);//search方法是返回某個或某段字元 在字串中第一次出現的位置 => 存在 返回下標,不存在返回-1 console.log(result);//-1 // 加忽略大小寫 var str = "good good study , Day dAy up"; var reg = /day/i;//忽略大小寫 var result = str.search(reg); console.log(result);//18 // 開啟非貪婪模式 var str = "good good study , day day up"; var reg = /day/; //忽略大小寫 var result = str.replace(reg, "money"); console.log(result); //good good study , money day up // 開啟貪婪模式 var str = "good good study , day day up"; var reg = /day/g; //忽略大小寫 全域性匹配 var result = str.replace(reg, "money"); console.log(result); //good good study , money money up
4. 正則的相關方法
(1) test() 判斷字串中是否 含有 符合規則的 某個或某段字元 有=> true, 沒有=>false
var str = "good good study , Day dAy up"; var reg = /day/; var result = reg.test(str); console.log(result); //false var str = "good good study , Day dAy up"; var reg = /day/ig; var result = reg.test(str); console.log(result); //true
(2) exec()將符合規則的某個或某段字元提取出來放到陣列中(始終只匹配一次),如果沒有則返回null
var str = "good good study , Day dAy up";
var reg = /day/ig;
var result = reg.exec(str);
console.log(result);
輸出結果:
(3) lastIndex返回下一次匹配時下標的開始位置(預設0)(前提:全域性匹配)
var str = "good good study , Day dAy up";
var reg = /day/ig;
console.log(reg.lastIndex);// 0
var result = reg.test(str);
console.log(result, reg.lastIndex);// true 21
var result = reg.test(str);
console.log(result, reg.lastIndex);// true 25
var result = reg.test(str);
console.log(result, reg.lastIndex);// false 0
5. 正則表示式中的字元
(1) 字面量字元(普通字元)
a-zA-Z0-9
(2) 元字元(特殊字元)
1.限定符 指定正則表示式中的給定元件(某個或某段字元=>子表示式)需要匹配多次才滿足
* 匹配前面的子表示式出現0次或多次
+ 匹配前面的子表示式出現1次或多次{1,}
? 匹配前面的子表示式出現0次或1次{0,1}
{n} 匹配n次
{n,} 匹配至少n次
{n,m}匹配至少n次,最多m次
例項:
// * 匹配前面的子表示式出現0次或多次
var str = "Mondy";
var reg = /da*y/ig; //可以匹配 dy day daay daay....
var result = reg.test(str);
console.log(result); //true
// + 匹配前面的子表示式出現1次或多次{1,}
var str = "Mondy";
var reg = /da+y/ig; //可以匹配 day daay daay....
var result = reg.test(str);
console.log(result); //false
// ? 匹配前面的子表示式出現0次或1次{0,1}
var str = "Mondy";
var reg = /da?y/ig; //可以匹配 dy day
var result = reg.test(str);
console.log(result); //true
// {n} 匹配n次
var str = "Mondaaay";
var reg = /da{3}y/ig; //可以匹配 daaay
var result = reg.test(str);
console.log(result); //true
// {n,} 匹配至少n次
var str = "Mondaay";
var reg = /da{2,}y/ig; //可以匹配 daay daaay...
var result = reg.test(str);
console.log(result); //true
//{n,m}匹配至少n次,最多m次
var str = "Mondaaay";
var reg = /da{2,3}y/ig; //可以匹配 daay daaay
var result = reg.test(str);
console.log(result); //true
2. 定位符
^匹配字串開始的位置以...開頭
$匹配字串結束的位置以...結尾
Tips:
單獨使用^和$依舊是包含關係不會將規則定死
同時使用^和$才會在一定程度上將規則定死
3. 字元匹配符
[xyz] 字元集合,匹配xyz中的任意一個字元
[0123456789]=>[0-9]匹配數字
[qwertyuiopasdfghjklzxcvbnm]=>[a-z]匹配小寫字母
[QWERTYUIOPASDFGHJKLZXCVBNM]=>[A-Z]匹配大寫字母
[0-9a-zA-Z_]匹配數字大小寫字母_中的任意一個
注意在字元匹配符中^代表取反
[^xyz]匹配除了xyz以外的任意一個字元
[^0-9]匹配非數字但是範圍太大
[^a-z]匹配非小寫
[^A-Z]匹配非大寫
[^0-9a-zA-Z_]匹配非數字大小寫字母_
字元簇(官方已經規定好的字元集合)
\d 匹配數字[0-9]
\D 匹配非數字[^0-9]
\w 匹配數字大小寫字母_[0-9a-zA-Z_]
\W 匹配非數字大小寫字母_[^0-9a-zA-Z_]
\s 匹配空白字元(換行符(\n)產生的空格/回車符(\r)產生空格/空格)
\S 匹配非空白字元(除了空白符以外的任意字元)
. 匹配除換行符(\n)以外的單個字元(任意字元)
[\u4e00-\u9fa5]匹配中文
關於空白字元
\n 換行符
\r 回車符
\f 分頁符
\t 製表符
\v 垂直製表符
轉義字元
Tips: 其中 \ 為轉義字元,在表示某一些特殊含義的字元時,需要新增"\"轉義字元,例如:要匹配+,就要寫成\+
var str = "1+1";
var reg = /1+1/;
var result = reg.test(str);
console.log(result); // false
var str = "1+1";
var reg = /1\+1/;
var result = reg.test(str);
console.log(result); // true
4.選擇匹配符
| 可以匹配多個規則(在正則表示式中代表"或"的關係 一般配合() 使用)
/(red|blue|green)/ 匹配red ,blue green中的任意一個
6.綜合案例
例項1:
// 手機號驗證
var phone = "17786531572";
var reg = /^1[3-9][0-9]{9}$/;
var result = reg.test(phone );
console.log(result);//true
例項2:
// 使用者名稱驗證
var user = "aaaaa哈哈";
var reg = /^[a-zA-Z][\w$_\u4e00-\u9fa5]{5,11}$/;
var result = reg.test(user );
console.log(result); //true
例項3:
// 郵箱驗證
var email = "[email protected]";
var reg = /^\w{6,18}@\w+\.(com|cn|edu)$/;
var result = reg.test(email );
console.log(result); //true
例項4:
// 網址驗證
var str = "https://www.baidu.com";
var reg = /^(http|https):\/\/(www.)?\w{2,}\.(com|edu|cn|net)$/;
var result = reg.test(str);
console.log(result); //true
例項5:
// 日期判斷驗證
var str = "2021-1-7";
var reg = /^\d{4}-\d{1,2}-\d{1,2}$/;
var result = reg.test(str);
console.log(result); //true
例項6:
// QQ號判斷驗證
var str = "534532";
var reg = /^[1-9]\d{4,}$/;
var result = reg.test(str);
console.log(result); //true