一篇筆記帶你玩轉正則表達式【就你最正則了~_~】

時間  2021-08-12
標籤 javascript java 正則表達式 算法 express 數組 markdown 函數 oop this 欄目 正則表達式 简体版
原文   原文鏈接

正則表達式

吃透此篇 正則就夠javascript

regular expression：RegExpjava

用來處理字符串的規則正則表達式

  • 只能處理字符串
  • 它是一個規則：能夠驗證字符串是否符合某個規則（test），也能夠把字符串中符合規則的內容捕獲到（exec / match...）
let str = "good good study , day day up！";
//=>學正則就是用來制定規則（是否包含數字）
let reg = /\d+/;
reg.test(str); //=>false

str = "2019-08-12";
reg.exec(str); //=>["2019",index:0,inputs:"原始字符串"]
複製代碼

編寫正則表達式算法

建立方式有兩種

//=>字面量建立方式（兩個斜槓之間包起來的，都是用來描述規則的元字符）
let reg1 = /\d+/;

//=>構造函數模式建立 兩個參數：元字符字符串，修飾符字符串
let reg2 = new RegExp("\\d+");
複製代碼

正則表達式由兩部分組成

  • 元字符
  • 修飾符
/*經常使用的元字符*/
//=>1.量詞元字符：設置出現的次數
* 零到屢次  
+ 一到屢次
? 零次或者一次
{n} 出現n次
{n,} 出現n到屢次
{n,m} 出現n到m次

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

//=>3.普通元字符：表明自己含義的
/zhufeng/ 此正則匹配的就是 "zhufeng"
複製代碼
/*正則表達式經常使用的修飾符：img*/
i =>ignoreCase  忽略單詞大小寫匹配
m =>multiline   能夠進行多行匹配
g =>global      全局匹配

/* /A/.test('lalala') =>false /A/i.test('lalala') =>true */
複製代碼

元字符詳細解析

^ $express

let reg = /^\d/;
console.log(reg.test("zhufeng")); //=>false
console.log(reg.test("2019zhufeng"));//=>true
console.log(reg.test("zhufeng2019"));//=>false
複製代碼
let reg = /\d$/;
console.log(reg.test("zhufeng")); //=>false
console.log(reg.test("2019zhufeng"));//=>false
console.log(reg.test("zhufeng2019"));//=>true
複製代碼
//=>^/$兩個都不加：字符串中包含符合規則的內容便可
let reg1 = /\d+/;
//=>^/$兩個都加：字符串只能是和規則一致的內容
let reg2 = /^\d+$/;

//=>舉個例子：驗證手機號碼（11位，第一個數字是1便可）
let reg = /^1\d{10}$/;
複製代碼

\數組

//=>.不是小數點，是除\n外的任意字符
let reg = /^2.3$/;
console.log(reg.test("2.3"));//=>true
console.log(reg.test("2@3"));//=>true
console.log(reg.test("23"));//=>false

//=>基於轉義字符，讓其只能表明小數點
reg = /^2\.3$/;
console.log(reg.test("2.3"));//=>true
console.log(reg.test("2@3"));//=>false

let str = "\\d";
reg = /^\d$/; //=>\d表明0-9的數字
console.log(reg.test(str)); //=>false
reg = /^\\d$/; //=>把特殊符合轉換爲普通的
console.log(reg.test(str)); //=>true
複製代碼

x|ymarkdown

let reg = /^18|29$/;
console.log(reg.test("18")); //=>true
console.log(reg.test("29")); //=>true
console.log(reg.test("129")); //=>true
console.log(reg.test("189")); //=>true
console.log(reg.test("1829")); //=>true
console.log(reg.test("829")); //=>true
console.log(reg.test("182")); //=>true
//---直接x|y會存在很亂的優先級問題，通常咱們寫的時候都伴隨着小括號進行分組，由於小括號改變處理的優先級 =>小括號：分組
reg = /^(18|29)$/;
console.log(reg.test("18")); //=>true
console.log(reg.test("29")); //=>true
console.log(reg.test("129")); //=>false
console.log(reg.test("189")); //=>false
//=>只能是18或者29中的一個了

複製代碼

[]函數

//1.中括號中出現的字符通常都表明自己的含義
let reg = /^[@+]$/;
console.log(reg.test("@")); //=>true
console.log(reg.test("+")); //=>true
console.log(reg.test("@@")); //=>false
console.log(reg.test("@+")); //=>false

reg = /^[\d]$/; //=>\d在中括號中仍是0-9
console.log(reg.test("d"));//=>false
console.log(reg.test("\\"));//=>false
console.log(reg.test("9"));//=>true

//2.中括號中不存在多位數
reg = /^[18]$/;
console.log(reg.test("1")); //=>true
console.log(reg.test("8")); //=>true
console.log(reg.test("18")); //=>false

reg = /^[10-29]$/; //=>1或者0-2或者9
console.log(reg.test("1"));//=>true
console.log(reg.test("9"));//=>true
console.log(reg.test("0"));//=>true
console.log(reg.test("2"));//=>true
console.log(reg.test("10"));//=>false

複製代碼

經常使用的正則表達式

  1. 驗證是否爲有效數字oop

    /* * 規則分析 * 1.可能出現 + - 號，也可能不出現 [+-]? * 2.一位0-9均可以，多位首位不能是0 (\d|([1-9]\d+)) * 3.小數部分可能有可能沒有，一旦有後面必須有小數點+數字 (\.\d+)? */
let reg = /^[+-]?(\d|([1-9]\d+))(\.\d+)?$/;

複製代碼

  2. 驗證密碼this

    //=>數字、字母、下劃線
//=>6~16位
let val = userPassInp.value,
    reg = /^\w{6,16}$/;
let flag=reg.test(val);
/* function checkPass(val){ if(val.length<6 || val.length>16){ alert('長度必須介於6-16位之間！'); return; } let area=['a','b'....'_']; //=>包含數字、字母、下劃線 for(let i=0;i<val.length;i++){ let char=val[i]; if(!area.includes(char)){ alert('格式不正確！'); return; } } } */

複製代碼

  3. 驗證真實姓名的

    /* * 1.漢字 /^[\u4E00-\u9FA5]$/ * 2.名字長度 2~10位 * 3.可能有譯名 ·漢字 (·[\u4E00-\u9FA5]{2,10}){0,2} */
let reg = /^[\u4E00-\u9FA5]{2,10}(·[\u4E00-\u9FA5]{2,10}){0,2}$/;

複製代碼

  4. 驗證郵箱的

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

//=> \w+((-\w+)|(\.\w+))*
//1.開頭是數字字母下劃線（1到多位）
//2.還能夠是 -數字字母下劃線 或者 .數字字母下劃線,總體零到屢次
//=>郵箱的名字由「數字、字母、下劃線、-、.」幾部分組成，可是-/.不能連續出現也不能做爲開始

//=> @[A-Za-z0-9]+
//1.@後面緊跟着：數字、字母 （1-多位）

//=> ((\.|-)[A-Za-z0-9]+)*
//1.對@後面名字的補充
// 多域名 .com.cn
// 企業郵箱 zxt@zhufeng-peixun-office.com

//=> \.[A-Za-z0-9]+
//1. 這個匹配的是最後的域名（.com/.cn/.org/.edu/.net...）

複製代碼

  5. 身份證號碼

    /* * 1. 一共18位 * 2. 最後一位多是X * * 身份證前六位：省市縣 130828 * 中間八位：年月日 * 最後四位： * 最後一位 => X或者數字 * 倒數第二位 => 偶數 女 奇數 男 * 其他的是通過算法算出來的 */
//let reg = /^\d{17}(\d|X)$/;
//=>小括號分組的第二個做用：分組捕獲，不只能夠把大正則匹配的信息捕獲到，還能夠單獨捕獲到每一個小分組的內容
let reg = /^(\d{6})(\d{4})(\d{2})(\d{2})\d{2}(\d)(\d|X)$/;
reg.exec("130828199012040617"); //=>["130828199012040617", "130828", "1990", "12", "04", "1", "7"...] 捕獲結果是數組，包含每個小分組單獨獲取的內容

複製代碼

正則兩種建立方式的區別

//=>構造函數由於傳遞的是字符串，\須要寫兩個才表明斜槓
let reg = /\d+/g;
reg = new RegExp("\\d+","g");

//=>正則表達是中的部份內容是變量存儲的值
//1.兩個斜槓中間包起來的都是元字符（若是正則中要包含某個變量的值，則不能使用字面量方式建立）
let type = "zhueng";
reg = /^@"+type+"@$/; 
console.log(reg.test("@zhufeng@")); //=>false
console.log(reg.test('@"""typeeeee"@')); //=>true
//2.這種狀況只能使用構造函數方式（由於它傳遞的規則是字符串，只有這樣才能進行字符串拼接）
reg = new RegExp("^@"+type+"@$");
console.log(reg.test("@zhufeng@"));//=>true

複製代碼

正則的捕獲

實現正則捕獲的辦法

  • 正則RegExp.prototype上的方法
    • exec
    • test
  • 字符串String.prototype上支持正則表達式處理的方法
    • replace
    • match
    • splite
    • .......
let str = "zhufeng2019yangfan2020qihang2021";
let reg = /\d+/;
/* * 基於exec實現正則的捕獲 * 1.捕獲到的結果是null或者一個數組 * 第一項：本次捕獲到的內容 * 其他項：對應小分組本次單獨捕獲的內容 * index：當前捕獲內容在字符串中的起始索引 * input：原始字符串 * 2.每執行一次exec，只能捕獲到一個符合正則規則的，可是默認狀況下，咱們執行一百遍，獲取的結果永遠都是第一個匹配到的，其他的捕獲不到 * =>「正則捕獲的懶惰性」：默認只捕獲第一個 */
console.log(reg.exec(str)); //=>["2019", index: 7, input: "zhufeng2019yangfan2020qihang2021"]
console.log(reg.exec(str)); //=>["2019"...]

/* //=>實現正則捕獲的前提是：當前正則要和字符串匹配，若是不匹配捕獲的結果是null let reg = /^\d+$/; console.log(reg.test(str)); //=>false console.log(reg.exec(str)); //=>null */

複製代碼

懶惰性的解決辦法

let str = "zhufeng2019yangfan2020qihang2021";
/* * reg.lastIndex：當前正則下一次匹配的起始索引位置 * 懶惰性捕獲的緣由：默認狀況下lastIndex的值不會被修改，每一次都是從字符串開始位置查找，因此找到的永遠只是第一個 * 解決辦法：全局修飾符g */
// let reg = /\d+/;
// console.log(reg.lastIndex); //=>0 下面匹配捕獲是從STR索引零的位置開始找
// console.log(reg.exec(str));
// console.log(reg.lastIndex); //=>0 第一次匹配捕獲完成，lastIndex沒有改變，因此下一次exec依然是從字符串最開始找，找到的永遠是第一個匹配到的

// let reg = /\d+/g;
// console.log(reg.exec(str)); //=>["2019"...]
// console.log(reg.lastIndex); //=>11 設置全局匹配修飾符g後，第一次匹配完，lastIndex會本身修改
// console.log(reg.exec(str)); //=>["2020"...]
// console.log(reg.lastIndex); //=>22
// console.log(reg.exec(str)); //=>["2021"...]
// console.log(reg.lastIndex); //=>32
// console.log(reg.exec(str)); //=>null 當所有捕獲後，再次捕獲的結果是null，可是lastIndex又迴歸了初始值零，再次捕獲又從第一個開始了...
// console.log(reg.lastIndex); //=>0
// console.log(reg.exec(str)); //=>["2019"...]

// let reg = /\d+/g;
// if (reg.test(str)) {
// //=>驗證一下:只有正則和字符串匹配咱們在捕獲
// console.log(reg.lastIndex); //=>11 基於TEST匹配驗證後，LASTINDEX已經被修改成第一次匹配後的結果，因此下一次捕獲再也不從頭開始了
// console.log(reg.exec(str)); //=>["2020"...]
// }

//=>需求：編寫一個方法execAll，執行一次能夠把全部匹配的結果捕獲到（前提正則必定要設置全局修飾符g）
~ function () {
    function execAll(str = "") {
        //=>str:要匹配的字符串
        //=>this:RegExp的實例（當前操做的正則）
        //=>進來後的第一件事，是驗證當前正則是否設置了G，不設置則不能在進行循環捕獲了，不然會致使死循環
        if (!this.global) return this.exec(str);
        //=>ARY存儲最後全部捕獲的信息 RES存儲每一次捕獲的內容（數組）
        let ary = [],
            res = this.exec(str);
        while (res) {
            //=>把每一次捕獲的內容RES[0]存放到數組中
            ary.push(res[0]);
            //=>只要捕獲的內容不爲NULL，則繼續捕獲下去
            res = this.exec(str);
        }
        return ary.length === 0 ? null : ary;
    }
    RegExp.prototype.execAll = execAll;
}();

let reg = /\d+/g;
console.log(reg.execAll("珠峯2019@2020培訓"));
//=>字符串中的MATCH方法，能夠在執行一次的狀況下，捕獲到全部匹配的數據（前提：正則也得設置G才能夠）
console.log("珠峯2019@2020培訓".match(reg));

複製代碼

正則的分組捕獲

//=>身份證號碼
let str = "130828199012040112";
let reg = /^(\d{6})(\d{4})(\d{2})(\d{2})\d{2}(\d)(?:\d|X)$/;
console.log(reg.exec(str));
console.log(str.match(reg));
//=>["130828199012040112", "130828", "1990", "12", "04", "1", index: 0, input: "130828199012040112"]
//=>第一項：大正則匹配的結果
//=>其他項：每個小分組單獨匹配捕獲的結果
//=>若是設置了分組（改變優先級），可是捕獲的時候不須要單獨捕獲，能夠基於?:來處理

複製代碼
//=>既要捕獲到{數字}，也想單獨的把數字也獲取到，例如：第一次找到 {0} 還須要單獨獲取0
let str = "{0}年{1}月{2}日";

/* //=>不設置g只匹配一次，exec和match獲取的結果一致（既有大正則匹配的信息，也有小分組匹配的信息） let reg = /\{(\d+)\}/; console.log(reg.exec(str)); console.log(str.match(reg)); //["{0}", "0",...] */

let reg = /\{(\d+)\}/g;
//console.log(str.match(reg)); //=>["{0}", "{1}", "{2}"] 屢次匹配的狀況下,match只能把大正則匹配的內容獲取到，小分組匹配的信息沒法獲取
let aryBig=[],
    arySmall=[],
    res=reg.exec(str);
while(res){
    let [big,small]=res;
    aryBig.push(big);
    arySmall.push(small);
    res=reg.exec(str);
}
console.log(aryBig,arySmall); //=>["{0}", "{1}", "{2}"] ["0", "1", "2"]

複製代碼
//=>分組的第三個做用：「分組引用」
let str = "book"; //=>"good"、"look"、"moon"、"foot"...
let reg = /^[a-zA-Z]([a-zA-Z])\1[a-zA-Z]$/; //=>分組引用就是經過「\數字」讓其表明和對應分組出現如出一轍的內容
console.log(reg.test("book")); //=>true
console.log(reg.test("deep")); //=>true
console.log(reg.test("some")); //=>false

複製代碼

正則捕獲的貪婪性

let str = "珠峯2019@2020培訓";
//=>正則捕獲的貪婪性：默認狀況下，正則捕獲的時候，是按照當前正則所匹配的最長結果來獲取的
let reg = /\d+/g;
console.log(str.match(reg)); //=>["2019","2020"]

//=>在量詞元字符後面設置？：取消捕獲時候的貪婪性（按照正則匹配的最短結果來獲取）
reg = /\d+?/g;
console.log(str.match(reg)); //=>["2", "0", "1", "9", "2", "0", "2", "0"]

複製代碼

問號在正則中的五大做用：

  • 問號左邊是非量詞元字符：自己表明量詞元字符，出現零到一次
  • 問號左邊是量詞元字符：取消捕獲時候的貪婪性
  • (?:) 只匹配不捕獲
  • (?=) 正向預查
  • (?!) 負向預查

其它正則捕獲的方法

  1. test也能捕獲（本意是匹配）

    let str = "{0}年{1}月{2}日";
let reg = /\{(\d+)\}/g;
console.log(reg.test(str)); //=>true
console.log(RegExp.$1); //=>"0"

console.log(reg.test(str)); //=>true
console.log(RegExp.$1); //=>"1"

console.log(reg.test(str)); //=>true
console.log(RegExp.$1); //=>"2"

console.log(reg.test(str)); //=>false
console.log(RegExp.$1); //=>"2" 存儲的是上次捕獲的結果

//=>RegExp.$1~RegExp.$9：獲取當前本次正則匹配後，第一個到第九個分組的信息

複製代碼

  2. replace 字符串中實現替換的方法（通常都是伴隨正則一塊兒使用的）

    let str = "zhufeng@2019|zhufeng@2020";
//=>把"zhufeng"替換成"珠峯"
//1.不用正則，執行一次只能替換一個
/* str = str.replace("zhufeng","珠峯").replace("zhufeng","珠峯"); console.log(str); */
//2.使用正則會簡單一點
str = str.replace(/zhufeng/g,"珠峯");
console.log(str);

複製代碼
    let str = "zhufeng@2019|zhufeng@2020";
//=>把"zhufeng"替換爲"zhufengpeixun"
//str=str.replace("zhufeng","zhufengpeixun").replace("zhufeng","zhufengpeixun");
//"zhufengpeixunpeixun@2019|zhufeng@2020" 每一次替換都是從字符串第一個位置開始找的（相似於正則捕獲的懶惰性）

//=>基於正則g能夠實現
str = str.replace(/zhufeng/g,"zhufengpeixun");

複製代碼

    案例：把時間字符串進行處理

    let time = "2019-08-13";
//=>變爲"2019年08月13日"
let reg = /^(\d{4})-(\d{1,2})-(\d{1,2})$/;

//=>這樣能夠實現
//time = time.replace(reg,"$1年$2月$3日");
//console.log(time); //=>2019年08月13日

//=>還能夠這樣處理 [str].replace([reg],[function])
//1.首先拿REG和TIME進行匹配捕獲，能匹配到幾回就會把傳遞的函數執行幾回（並且是匹配一次就執行一次）
//2.不只把方法執行，並且REPLACE還給方法傳遞了實參信息（和exec捕獲的內容一致的信息：大正則匹配的內容，小分組匹配的信息....）
//3.在函數中咱們返回的是啥，就把當前大正則匹配的內容替換成啥
/* time = time.replace(reg,(big,$1,$2,$3)=>{ //=>這裏的$1~$3是咱們本身設置的變量 console.log(big,$1,$2,$3); }); */
time = time.replace(reg,(...arg)=>{
    let [,$1,$2,$3]=arg;
    $2.length<2?$2="0"+$2:null;
    $3.length<2?$3="0"+$3:null;
    return $1+"年"+$2+"月"+$3+"日";
});

複製代碼

    單詞首字母大寫

    let str = "good good study，day day up！";
let reg = /\b([a-zA-Z])[a-zA-Z]*\b/g;
//=>函數被執行了六次，每一次都把正則匹配信息傳遞給函數
//=>每一次ARG:["good","g"] ["good","g"] ["study","s"]...
str = str.replace(reg,(...arg)=>{
    let [content,$1]=arg;
    $1=$1.toUpperCase();
    content=content.substring(1);
    return $1+content;
});
console.log(str); //=>"Good Good Study，Day Day Up！"

複製代碼

    驗證一個字符串中那個字母出現的次數最多，多少次？

    /*==（去重思惟）==*/
let str = "zhufengpeixunzhoulaoshi";
let obj = {};
[].forEach.call(str, char => {
	if (typeof obj[char] !== "undefined") {
		obj[char]++;
		return;
	}
	obj[char] = 1;
});
let max = 1,
	res = [];
for (let key in obj) {
	let item = obj[key];
	item > max ? max = item : null;
}
for (let key in obj) {
	let item = obj[key];
	if (item === max) {
		res.push(key);
	}
}
console.log(`出現次數最多的字符：${res}，出現了${max}次`);

/*==排序==*/
let str = "zhufengpeixunzhoulaoshi";
str = str.split('').sort((a, b) => a.localeCompare(b)).join('');
// console.log(str);//=>"aeefghhhiilnnoopsuuuxzz"
let ary = str.match(/([a-zA-Z])\1+/g).sort((a, b) => b.length - a.length);
// console.log(ary); //=>["hhh", "uuu", "ee", "ii", "nn", "oo", "zz"]
let max = ary[0].length,
	res = [ary[0].substr(0, 1)];
for (let i = 1; i < ary.length; i++) {
	let item = ary[i];
	if (item.length < max) {
		break;
	}
	res.push(item.substr(0, 1));
}
console.log(`出現次數最多的字符：${res}，出現了${max}次`);

/*==從最大到最小去試找==*/
let str = "zhufengpeixunzhoulaoshi",
	max = 0,
	res = [],
	flag = false;
str = str.split('').sort((a, b) => a.localeCompare(b)).join('');
for (let i = str.length; i > 0; i--) {
	let reg = new RegExp("([a-zA-Z])\\1{" + (i - 1) + "}", "g");
	str.replace(reg, (content, $1) => {
		res.push($1);
		max = i;
		flag = true;
	});
	if (flag) break;
}
console.log(`出現次數最多的字符：${res}，出現了${max}次`);

複製代碼

    其它方法：formatTime 、 queryURLParams 、 millimeter

    ~ function () {
	/* * formatTime：時間字符串的格式化處理 * @params * templete:[string] 咱們最後指望獲取日期格式的模板 * 模板規則:{0}->年 {1~5}->月日時分秒 * @return * [string]格式化後的時間字符串 * by zhufengpeixun on 2019/08/13 */
	function formatTime(templete = "{0}年{1}月{2}日 {3}時{4}分{5}秒") {
		let timeAry = this.match(/\d+/g);
		return templete.replace(/\{(\d+)\}/g, (...[, $1]) => {
			let time = timeAry[$1] || "00";
			return time.length < 2 ? "0" + time : time;
		});
	}

	/* * queryURLParams：獲取URL地址問號和麪的參數信息（可能也包含HASH值） * @params * @return * [object]把全部問號參數信息以鍵值對的方式存儲起來而且返回 * by zhufengpeixun on 2019/08/13 */
	function queryURLParams() {
		let obj = {};
		this.replace(/([^?=&#]+)=([^?=&#]+)/g, (...[, $1, $2]) => obj[$1] = $2);
		this.replace(/#([^?=&#]+)/g, (...[, $1]) => obj['HASH'] = $1);
		return obj;
	}

	/* * millimeter：實現大數字的千分符處理 * @params * @return * [string]千分符後的字符串 * by zhufengpeixun on 2019/08/13 */
	function millimeter() {
		return this.replace(/\d{1,3}(?=(\d{3})+$)/g, content => content + ',');
	}
	
	/* 擴展到內置類String.prototype上 */
	["formatTime", "queryURLParams", "millimeter"].forEach(item => {
		String.prototype[item] = eval(item);
	});
}();

複製代碼

最後一句 若有幫助加個關注唄

不善言辭 乾貨十足 作人不要太正則

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程