1.建立一個正則表達式

要領一：運用一個正則表達式字面量，其由包含在斜杠之間的情勢構成。

var reg1 = /a/;
var reg2 = /ab+c/;

要領二：挪用RegExp對象的組織函數

var reg1 = new RegExp( "a" );
var reg2 = new RegExp( "ab+c" );

2.正則表達式中的特別字符

1.轉義字符

    \s: 空格
    \S: 非空格
    \d: 数字
    \D: 非数字
    \w: 字母，数字，下劃線
    \W: 非字母，非数字，非下劃線。
    \ 舉行轉換。情勢 /a*/ 代表會婚配 0 個或許多個 a。相反，情勢 /a\*/ 將 '*' 的特別性移除，從而能夠婚配像 "a*" 如許的字符串。
    . : 代表 任何一個字符
    \b: 肇端,完畢,空格。eg：/\bm/婚配“moon”中得‘m’；/oo\b/並不婚配"moon"中得'oo'，由於'oo'被一個“字”字符'n'緊跟着。


var str = "12 3123";
console.log( str.replace( /\b/g,"|" ) );//|12| |3123|

2.量詞

     {n,m}: n 和 m 都是整數。婚配前面的字符最少n次，最多m次。假如 n 或許 m 的值是0， 這個值被疏忽。
     *: 婚配前一個表達式0次或屢次。等價於 {0,}。
     +: 婚配前面一個表達式1次或許屢次。等價於{1,}。
     ?: 婚配前面一個表達式0次或許1次。{0,1}。
     .: 婚配除換行符以外的任何單個字符。

注重：假如 ? 緊跟在任何量詞 *、 +、? 或 {} 的背面，將會使量詞變成非貪慾的（婚配只管少的字符），和缺省運用的貪慾情勢（婚配只管多的字符）恰好相反。

3. 字符類
1.[ ]

[]：婚配[]中內容的一個字符.這指的是局限婚配。     
eg:/[a-zA-Z0-9]/:只如果数字，字母都能婚配上。
eg:/[abc]/:只如果a或許b或許c，个中一個都能婚配的上。
eg:/[a-z.]+/:都婚配“test.i.ng”中的一切字符。
[]:內部不須要加|，由於它就示意一個局限，有或許的寄義。

舉例申明1

            var re = /0|1|2/g;
            var re = /[012]/g;
            var re = /[0-2]/g;
            以上三種正則表達是一個意義

舉例申明2

          var re = /^([0-9]|1[0-9])$/g; // 推斷数字局限是不是在 0-19 之間
          console.log( re.test(20) );//false
          console.log( re.test(2) );//true

2. ^

^ : 婚配輸入的最先。
eg: /^A/ 並不會婚配 "an A" 中的 'A'，然則會婚配 "An E" 中的 'A'。^示意最先。

注重：^放在[]中，示意非的意義。

eg： 比方，[^abc] 和 [^a-c] 是一樣的。他們婚配"brisket"中的‘r’，也婚配“chop”中的‘h’。 意義是：不是a不是b不是c，則婚配勝利。    

3. $

$ : 婚配輸入的完畢。
eg: /t$/ 並不會婚配 "eater" 中的 't'，然則會婚配 "eat" 中的 't'。

3.運用正則表達式的要領,正則的貪慾情勢和非貪慾情勢

1. test：運用正則婚配字符串,假如婚配 返回true,不然false
   運用：正則.test(字符串);

<script>
        //1.是不是存在数字
        var re1=/\d/;
        console.log(re1.test("asbcc1"));//true
        console.log(re1.test("asbcd"));//false
        //2.是不是滿是数字
        var re2=/\D/;
        console.log(!re2.test("asbcc1"));//false
        console.log(!re2.test("123445"));//true
</script>

2.search:運用正則婚配字符串,假如婚配 返回對應位置,不然返回-1。
運用：字符串.search(正則);
注重：正則辨別大小寫，假如想不辨別大小寫，則須要增加標識符 i 。關於兩種建立正則的體式格局，i 有兩中差別的寫法。

<script>
        var re=/Ao/;
        var str1="aobbbllll";
        console.log(str1.search(re));//-1

        //簡寫要領 不辨別大小寫
        var re1=/Ao/i;
        console.log(str1.search(re1));//0


        //挪用RegExp對象的組織函數 不辨別大小寫
        var re2=new RegExp("Ao","i");
        console.log(str1.search(re2));//0
</script>

3.match: 運用正則婚配字符串,假如婚配,返回對應字符串,返回數組情勢,不然 null。
運用: 字符串.match(正則)。

注重:
    1. 返回的是範例是數組
    2. 正則默許婚配勝利就會住手，運用標識符 g(全局婚配)。

<script>
    var str = "123a456b7890";
    
    var re1 = /\d/;
    var re2 = /\d/g;
    var re3 = new RegExp(/\d/,"g");
    var re4 = /\dA/ig;
    var re5 = new RegExp(/\dA/,"ig");
    console.log( str.match( re1 ) );//["1", index: 0, input: "123a456b7890", groups: undefined]
    console.log( str.match( re2 ) );//["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]
    console.log( str.match( re3 ) );//["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]
    console.log( str.match( re4 ) );//["3a"]
    console.log( str.match( re5 ) );//["3a"]
</script>

4.注重：正則的貪慾情勢
起首需相識： +的寄義是： 婚配前面一個表達式1次或許屢次。等價於{1,}。

以下是貪慾情勢

<script>
    var str = "6z123a456b7890";
    var re = /\d+/g;
    console.log( str.match( re ) );//["6", "123", "456", "7890"]    
</script>

詮釋：
1.正則的貪慾情勢是指會婚配最長的，獲得數量最多的項。
2.假如 ? 緊跟在任何量詞 *、 +、? 或 {} 的背面，將會使量詞變成非貪慾的（婚配只管少的字符），和缺省運用的貪慾情勢（婚配只管多的字符）恰好相反。

以下黑白貪慾情勢

<script>
    var str = "6z123a456b7890";
    var re = /\d+?/g;
    console.log( str.match( re ) );//["6", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]
</script>

5.replace:運用正則婚配字符串,假如婚配勝利,替代對應字符串,返回婚配后的字符串。假如不勝利，則返回原字符串。
運用： 字符串.replace(正則,替代字符串);

<script>
    var str = "miaovketang";
    var re1 = /a/;//不全局婚配，意義為婚配勝利就完畢
    var re2 = /a/g;//全局婚配，意義為婚配到字符串完畢為止。
    console.log( str.replace( re1,"b" ) );//mibovketang
    console.log( str.replace( re2,"b" ) );//mibovketbng
</script>

4.正則的運用

1.敏感詞過濾
每一個網站都有本身的敏感詞，比方此次的敏感詞為：星星，好，天空，這三個詞。

<script>
        var str="星星掛在天空上好優美";
        var re=/星星|天空|好/g;
        var str2=str.replace(re,function ($0) {
            var temp="";
            console.log($0);//replace 第二個參數假如是函數的話，這個函數的第一個參數是每次婚配到的 字符。獲得的效果 星星，天空，好
            for(var i=0;i<$0.length;i++){
                temp+="*";
            }
            return temp;
        });

        console.log(str2);
</script>

剖析：
1.replace 第二個參數能夠是一個字符串,或許函數
2.replace 第二個參數假如是函數的話，這個函數的第一個參數是每次婚配到的 字符。
3.我給參數的命名為$0,這個是隨便的，只需不是關鍵字保留字都能夠。比方a，b都能夠的。

2.格式化時候
體式格局一：

<script>
        var str = "2018-6-25"; //轉化成 2018.6.25
//      var str = "2018/6/25"; //轉化成 2018.6.25
//      var str = "2018~6!25"; //轉化成 2018.6.25
//      var str = "2018年6月25"; //轉化成 2018.6.25

        var re=/\D/g;
        var str2=str.replace(re,".");

        console.log(str2);//2018.6.25
</script>

體式格局二：

<script>
        var str = "2018-6-25"; //轉化成 2018.6.25
        var re=/(\d+)\D/g;
        var str2=str.replace(re,function ($0,$1) {
            console.log($0,$1);
            return $1+".";
        });

        console.log(str2);//2018.6.25
    </script>

體式格局二的剖析：replace 第二個參數假如是函數的話，
1.這個函數的 第一個參數 是每次婚配到的 字符。
2.以後的參數是經由過程（）的分組，子項根據 "("肯定序次。
3.比方第二個參數就是（\d+）婚配到的內容。

3.婚配情勢參數的申明
運用狀況舉例：當運用replace，而且replace的第二個參數是函數。則這個函數的參數狀況，第一個參數是正則婚配到的值。以後的參數是經由過程（ ）的分組，子項根據 "("肯定序次。

舉例一：

<script>
var str = "2018-6-25"; //2018.6.25
//        var re = /(\d+)\D/g;//運用這個正則，打印效果為：2018.6.25
        var re = /(\d)+\D/g;//運用這個正則，打印效果為：8.6.25
        console.log( str.replace( re,function($0,$1){
            console.log( $0,$1 );
            return $1+".";
        } ) );
</script>

舉例二:

<script>
    var str = "2018-6-25"; //2018.6.25
    var re = /(((\d)+)(\D))/g;
    str.replace(re, function ($0, $1, $2, $3, $4) {
        console.log($0, $1, $2, $3, $4);
        //打印效果以下：
        //2018- 2018- 2018 8 -
        //6- 6- 6 6 -
    });
</script>

4.過濾標籤

<script>
    var str = "<div>你好,</div><><a>優美的</a>上海";//想轉化成 你好，優美的上海
    var re=/<.*?>/g; // 假如背面加？，就會進入非貪慾情勢。
    // var re=/<.*>/g; //假如背面不加？，就會進入貪慾情勢，效果為 上海。
    str2=str.replace(re,"");
    console.log(str2); //你好,優美的上海。
</script>

5.搜檢是不是含有class名

<body>
    <div id="box" class="div box1 box2"></div>
    <script>
        function checkClass(el,val) {
            var re = new RegExp("\\b"+val+"\\b","g")
            return re.test(el.className);
        }

        var box=document.getElementById("box");
        console.log(checkClass(box,"box2"));//true
        console.log(checkClass(box,"box"));//false
    </script>
</body>

6.找出反覆次數最多的字符

要領一：不運用正則。

<script>
    var str = "abcdabcaba";
    var obj={};
    var max=0;//湧現次數
    var maxValue = "";//湧現的字符
    //天生對象,字符為鍵名，此時為鍵值。
    for(var i=0;i<str.length;i++){
        if(!obj[str[i]]){
            obj[str[i]]=1;
        }else{
            obj[str[i]]+=1;
        }
    }
    console.log(obj);
    //遍歷舉行比較，取湧現的最大次數的鍵名和鍵值
    //則為湧現最多的字符和湧現最多的次數。
    for( var i in obj){
        if(max< obj[i]){
            max=obj[i];
            maxValue=i;
        }
    }
    console.log(max,maxValue);
</script>

要領二：運用正則。

<script>
    var str = "abcdabcaba";
    str=str.split("").sort().join("");
    console.log( str );//aaaabbbccd
    var re=/(\w)\1*/g;
    var max=0;
    var maxValue="";
    str.replace(re,function ($0,$1) {
        if(max<$0.length){
            max=$0.length;
            maxValue=$1;
        }
    });
    console.log(max,maxValue);
</script>

剖析：\1, \背面的是数字1，不是字母l。
\1是作用是\1前面的表達式，最少要反覆一遍。而且前面的表達式要用（ ）包起來。

\1的運用申明

<script>
    var re = /(\d)\1+/g;
    console.log( re.test( "a00" ) );//true
    console.log( re.test( "a01c" ) );//false
    console.log( re.test( "a012c" ) );//false
    console.log( re.test( "a0123131323c" ) );//false
    console.log( re.test( "a0000c" ) );//true
</script>

7.檢測qq號

<body>
<!--
   1. 6-12位 純数字
   2. 不能以0開首
-->
    <input type="text" id="t" />
    <button id="btn">click</button>
    <script>
        var t = document.getElementById("t");
        var btn = document.getElementById("btn");
        btn.onclick=function () {
            var str=t.value;
            var re=/^([^0]\d{5,11})$/;
            if(re.test(str)){
                console.log("經由過程考證");
            }else{
                console.log("不經由過程考證");
            }
        }
    </script>
</body>

8.去掉前背面的空格

<script>
        var str = "  hel lo ";
        console.log( "|"+ str +"|" );
        console.log( "|"+ str.trim() +"|" );//採納trim()要領也能夠完成。
        console.log( "|"+ trimFn(str) +"|" );
        
        function trimFn( s ){
            var re = /^\s+|\s+$/g;
            return s.replace( re,"" );
            //return re.test(s);
        }
        
    </script>