JavaScript正則應用（基礎）

阿新 • • 發佈：2019-02-02

正則表示式概念

正則表示式，又稱規則表示式。（英語：Regular Expression，在程式碼中常簡寫為regex、regexp或RE），電腦科學的一個概念。正則表通常被用來檢索、替換那些符合某個模式(規則)的文字。

正則表示式是跟具體語言（比如JavaScript）無關的。因為正則表示式是用來處理字串問題的，基本上每門語言都有字串型別，那麼也都會支援正則表示式的。正則表示式是分流派的，也跟實現引擎有關。而JavaScript用到的正則表示式的語法，是市面常見語言都支援的核心子集。

基本語法

1 表示式形式：

var reg = / pattern / flags;

2 JavaScript 寫法：

字面量表達式：/正則的規則/識別符號
通過建構函式生成：new RegExp()

var str = "好像sdaa324上飛機大13"；
var reg = /13/;   //字面量表達式
//或者var reg = new RegExp("13")   建構函式
alert(reg.test(str))//彈出true

3 JavaScript應用：

reg.test(str)返回一個布林值
string.match(正則規則)返回一個類陣列。
- 上方法匹配返回的類陣列，擁有index（匹配在字串中的索引）、input（母字串）屬性。在加g全域性匹配後屬性消失。
string.replace(正則規則，替換的字串或者函式)字串替換
函式要返回一個字串,接受三個引數：1.匹配的內容。 2.下標。 3.源字串

var str = "121241xx1231241xx1231"
var reg = /xx/g;
str.replace(reg,"替換")   //字串變為=》121241替換1231241替換1231
str.replace(reg,function(a,b,c){
    console.log(a,b,c)   
    //xx   0   121241xx1231241xx1231
    //xx   15  121241xx1231241xx1231 

})

正則核心

正則表示式是由兩個/符號包裹起來的，兩個/裡面的（上面的pattern）就是需要的任何簡單或者是複雜的正則表示式。而在第二個/後面是一個或者是多個標誌（flags），用來標明正則表示式的行為。

flags：識別符號有以下五種行為：

g：表示全域性（global）模式，即在匹配到第一個後繼續匹配
i：忽略（ignore）大小寫
m：便是多行（multiline）模式，即到達一行時繼續查詢下一行
y：(ES6新增的粘連修飾符)也是全域性匹配，不過第二次會接著上一次匹配停止的地方開始。
u：(ES6新增)

replace()經典用法！

var str = "first 第二部分"
var reg = /(\w+)\s(第二部分)/g
console.log(str.replace(reg,"$2 $1"))  //$2 $1代表正則的子集， 互換位置即可實現兩者互換！

基礎規則

元字元

轉義符號\
可轉義特殊符號區別於普通字元的意義。
常用特殊字元：
- .匹配除了換行以外其他所有字元！
- \n換行
- \rtab製表符
- \d數字0-9
- \D非數字
- \s空格
- \S非空格
- \w字元(數字、字母、_ )
- \W非字元(與\w互補)
- \b獨立部分（單詞邊界：起始結束連詞符）
- \B非獨立部分
量詞，一般由{}包裹
- {0,n}出現0-n次
- {0，1}有或者沒有，可簡寫為？
- {0，}0-正無窮，簡寫為*
- {1，}1-正無窮，簡寫為+
- 貪婪匹配：
  1. 預設量詞取能匹配的最大值！
- 非貪婪匹配
  1. {}？量詞取能匹配的最小值！
識別符號：
- g全域性匹配
- i忽略大小寫
- m多行匹配
- yes6新增粘連修飾符
- ues6新增
起始符、結束符
- ^規定以特定字元開頭
- $規定以特定字元結尾
子集：()
被括號括起來部分將的當做一個整體進行量詞處理後，匹配！
例如：

var str = "ababbabbb";
var reg = /ab+/gi;   //匹配（1-無窮）個b
console.log(str.match(reg))  //ab  abb  abbb

var reg1 = /(ab)+/gi;  //匹配（1-無窮）個ab
console.log(str.match(reg1))  //abab ab

遇到多層巢狀子集時，先匹配外層，再匹配內層！

範圍詞：
1. []
  - 如[a-z]表示範圍在小寫字母的任意字元
  - [A-Za-z0-9]表示範圍在大小寫字母或者數字中的任意字元
2. 漢字匹配範圍：[\u4e00-\u9fa5]
3. [^1]取反，即匹配不是1的字元！

var str = "12"
var reg = /[^1|2/g
console.log(str.match(reg))  //2

常見字串正則匹配

`/(\w)\1+/g` 其中：`\1`代表第一個子集，如果不加，將匹配整個字串！

var str = "aaabbbcccdddfffwwwqqqq"
var reg = /(\w)\1+/g  
console.log(str.match(reg))
// [aaa,bbb,ccc,ddd,fff,www,qqqq]

取最長子串

var str = "aaabbbbbbcccc"
var reg = /(\w)\1+/g;
var obj,num;
var leng =0;
while((obj=reg.exec(str)) !=null){
    if(obj[0].length>leng){
        leng = obj[0].length;
        num = obj[0]
    }
}
console.log(num)// bbbbbb

或者

var str = "aaabbbbbbcccc"
var reg = /(\w)\1+/g;
var arr= str.match(reg);
var leng = 0
var num;
for(var i=0;i<arr.length;i++){
    if(arr[i].length>leng){
        leng = arr[i].length;
        num =arr[i]
    }
}
console.log(num)//bbbbbb

字串模板，對接json資料

var dic = {
    name:"chenqian",
    age:21,
    gfriend:1
}
var str = "大家好，我叫&name&，今年&age&，我有&gfriend&個女朋友，哈哈！"
var reg = /\&(\w+)\&/g;
str = str.replace(reg, function(match,$1){
    console.log($1)//name age gfriend
    return dic[$1];
})
console.log(str) //大家好，我叫chenqian，今年21，我有1個女朋友，哈哈！

敏感詞過濾

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Author" content="">
    <title>敏感詞替換</title>
    <style>
        *{margin:0;padding:0;font-family: Microsoft YaHei,serif;}
        li{list-style: none;}
        span{
            display: block;
        }
        .time{
            color:#888;
        }
    </style>
</head>
<body>
    <input type="text" id="txt">
    <button>傳送</button>
    <ul>
        <!--<li><span class="time">2017-11-27 21:48</span>
            <span>臥槽</span>
        </li>-->
    </ul>
    <script>
        var Txt = document.getElementById("txt"),
            send = document.getElementsByTagName("button")[0],
            ul = document.getElementsByTagName("ul")[0],
            reg = /傻逼|我操|操|操你媽|你媽|我日|日/g;

        send.onclick=function () {
            var val = Txt.value;
            if(val){
                val = val.replace(reg,function (match) {
                    console.log(match)
                    var str = "";
                    for(var i=0;i<match.length;i++){
                        str += "*";
                    }
                    return str;
                })
                //獲取時間
                var date = new Date(),
                    hh = addZero(date.getHours()),
                    mm = addZero(date.getMinutes()),
                    ss = addZero(date.getSeconds());

                var time = hh + ":" + mm + ":"+ss;

                ul.innerHTML += "<li><span class='time'>"+time+"</span><span>"+val+"</span></li>"

            }
        }
        function addZero(n) {
            return n<10?"0"+n:""+n;
        }
    </script>
</body>
</html>

登入驗證、號碼、qq號等…

var reg = {
    tel:/^1[1-3]\d{9}$/, 
    qq:/^[1-9]\d{4,10}$/,
    id:/^^[1-9]\d{5}$/,
    url : /^(http|https):\/\/[\S]*$/,
    email : /^[1-9A-Za-z]\w{5,19}@[1-9a-z]{2,7}\.[a-z]{2,5}$/,
    user : /^[1-9a-zA-Z_]\w{5,19}$/,
    pwd : /^[\[email protected]#$%^&*()_+\-=/{}\[\]:";',.\/]{6,20}$/
}

JavaScript正則應用（基礎）

正則表示式概念

基本語法

1 表示式形式：

2 JavaScript 寫法：

3 JavaScript應用：

正則核心

基礎規則

元字元

常見字串正則匹配

`/(\w)\1+/g` 其中：`\1`代表第一個子集，如果不加，將匹配整個字串！

取最長子串

字串模板，對接json資料

敏感詞過濾

登入驗證、號碼、qq號等…

JavaScript正則應用（基礎）

JavaScript正則表示式（基礎、分組、懶惰匹配、反向引用和零寬斷言）

正則表示式（基礎）

詳解JavaScript正則表示式（三）

詳解JavaScript正則表示式（一）

JavaScript正則表示式（三）字串例項方法search

正則表示式（基礎2）

python之正則表示式（基礎篇）

機器學習基礎（三十） —— 線性迴歸、正則化（regularized）線性迴歸、區域性加權線性迴歸（LWLR）

正則表示式（re）

正則表示式（數量詞）

正則表示式（RegEx）——快速參考

MySQL 正則表示式（REGEXP）

js正則表示式（2）

jsp頁面驗證手機號的正則表示式（最新）

Python :正則表示式（1）

常用正則表示式（copy）

Python爬蟲之正則表示式（1）

常用正則表達（轉）

JavaScript之ECMAScript筆記（基礎）

JavaScript正則應用（基礎）

正則表示式概念

基本語法

1 表示式形式：

2 JavaScript 寫法：

3 JavaScript應用：

正則核心

基礎規則

元字元

常見字串正則匹配

/(\w)\1+/g 其中：\1代表第一個子集，如果不加，將匹配整個字串！

取最長子串

字串模板，對接json資料

敏感詞過濾

登入驗證、號碼、qq號等…

相關推薦

`/(\w)\1+/g` 其中：`\1`代表第一個子集，如果不加，將匹配整個字串！