正則表達式

正則表達式的建立、匹配字符串、轉義、字符類、重複以及經常使用字符

首先是工具推薦：

http://tools.jb51.net/regex/create_reg

http://tools.jb51.net/regex/javascript

 

---

 

i ignoreCase 忽略大小寫

g global 全局

m multiline 多行

 

---

 

正則匹配

pattern.test(str)

pattern.exec(str)

 

---

 

修飾符的用法

var pattern = new RegExp('js', 'i');
var pattern = /js/i;

用戶輸入獲取要匹配的文本

var pattern = '/' + userInput + '/i';
var pattern = new RegExp(userInput, 'i');

轉義字符 \

匹配換行符 \n

    var str = '1.html\n2.css\n3.js';
    var pattern = /\n/;
    console.log(str);
    console.log(pattern.exec(str));

話說這個換行符好Q

 

---

 

匹配空格\t

 

---

 

十六進制匹配\x開頭：

a=\x61

b=\x62

\n=\x0A

    var str = 'a\nb';
    var pattern = /\x61\x0A\x62/;
    console.log(pattern.exec(str));

unicode表示：

\u0009=\t 空白符

    var str = '    js';
    var pattern = /\u0009/;
    console.log(pattern.exec(str));

基本漢字unicode範圍：\u4e00-\u9fa5

 

---

 

方括號是單個匹配，表示出現j或者s

    var str = 'sjavascript';
    var pattern = /[js]/;

^在[]裏面表明非

^在[]外面表明是爲首

    var str = 'jscript';
    var pattern = /[^js]/;//不是j或者s
    console.log(pattern.exec(str));

.表明任意字符，但不能匹配\n

    var str = '\n';
    var pattern = /./;
    console.log(pattern.exec(str));

/[a-zA-Z0-9_]/ /\w/ =數字字母下劃線

/[^a-zA-Z0-9_]/ /\W/ =非數字字母下劃線

\d 匹配數字

\s 匹配空格

 

---

 

匹配價格

    var str = '肯德基豪華午飯：￥15.5！';
    var pattern = /\d{1,}\.{0,1}\d{0,}/;
    console.log(pattern.exec(str));

+ 匹配一次或更屢次的重複
+?匹配一次或更屢次的重複，可是在能使整個匹配成功的前提下使用最少的重複

貪婪模式

    var str = '<td><p>a</p></td><td><p>b</p></td>';
    var pattern = /<td>.*<\/td>/;
    console.log(pattern.exec(str));

懶惰模式

    var str = '<td><p>a</p></td><td><p>b</p></td>';
    var pattern = /<td>.*?<\/td>/;
    console.log(pattern.exec(str));

正則表達式的() [] {} 有着不一樣的意思

（） 是爲了提取匹配字符串的，表達式中有幾個()就有幾個相應的匹配字符串

(abc)？ 表示這一組要麼一塊兒出現，要麼不出現，出現那則按順序出現。

(？：abc)表示找到同樣abc的一組，可是不記錄，不保存到变量中，否则可以通过" role="presentation" style="overflow-wrap: normal; max-width: none; max-height: none; min-width: 0px; min-height: 0px; float: none;" id="MathJax-Element-1-Frame">變量中，不然能夠經過變量中，不然能夠經過x取第幾個括號所匹配到的項。好比(aaa)(bbb)(ccc)(?:ddd)(eee)能夠用1获取(aaa)匹配到的内容，而" role="presentation" style="overflow-wrap: normal; max-width: none; max-height: none; min-width: 0px; min-height: 0px; float: none;" id="MathJax-Element-2-Frame">1獲取(aaa)匹配到的內容，而1獲取(aaa)匹配到的內容，而3則獲取到了(ccc)匹配到的內容，而$4則獲取的是由(eee)。

a(?=bbb)順序環視 表示a後面必須緊跟3個連續的b

(\s*)表示連續空格的字符串

 

---

 

[] 是定義匹配的字符範圍。好比[a-zA-Z0-9]表示相應位置的字符要匹配英文字符和數字。[\s*表示空格或者*號]

{}通常是用來匹配的長度。好比\s{3}表示匹配三個空格，\s[1,3]表示匹配1到3個空格

(0-9)匹配'0-9'自己。[0-9]*匹配數字（注意後面有*，能夠爲空）[0-9]+匹配數字(注意後面有+，不能夠爲空)，

{0-9}寫法是錯誤的

[0-9]{0,9}表示長度爲0到9的數字字符串。

 

---

 

\1 = ab

    var str = '<p><a>這是一段文字</a></p>';
    var pattern = /<([a-zA-Z]+)>(.*?)<\/\1>/;
    console.log(pattern.exec(str));

指定匹配位置

^開始 $結尾

匹配全是數字，方法一：

    var str = '110119120';
    var pattern = /^\d+$/;
    console.log(pattern.exec(str));
    if (pattern.test(str)) {
        console.log('全是數字！');
    } else {
        console.log('不全是數字！');
    }

匹配全是數字，方法二：

    var str = '11011a9120';
    var pattern = /\D/;
    console.log(pattern.exec(str));
    if (pattern.test(str)) {
        console.log('不全是數字！');
    } else {
        console.log('全是數字！');
    }

\b = 單詞邊界

    var str = '@@@js@@@';
    var pattern = /\bjs\b/; //@也被識別爲單詞邊界
    console.log(pattern.exec(str));

經過類名獲取元素

    function getByClassName(className, parentNode) {
        if (document.getElementsByClassName) {
            return document.getElementsByClassName(className);
        } else {
            parentNode = parentNode || document;
            var nodeList = [];
            var allNodes = parentNode.getElementsByTagName('*');
            // 正則匹配某個類名
            var pattern = new RegExp('\\b' + className + '\\b');

            for (var i = 0; i < allNodes.length; i++) {
                if (pattern.test(allNodes[i].className)) {
                    nodeList.push(allNodes[i]);
                }
            }
            // 返回全部匹配到的元素集合
            return nodeList;
        }
    }

\b和\s有什麼區別

\babc\b匹配的是"abc"
\sabc\s匹配的不是"abc", 先後還帶空格" abc "
\b只是匹配字符串開頭結尾及空格回車等的位置, 不會匹配空格符自己

 

---

 

若是後面緊跟script，則匹配java

    var str = 'javascript';
    var pattern = /java(?=script)/;
    console.log(pattern.exec(str));

正則表達式 - (?!), (?:), (?=)的區別

(?:pattern) 非獲取匹配，匹配pattern但不獲取匹配結果，不進行存儲供之後使用。

(?=pattern) 非獲取匹配，正向確定預查。例如，「Windows(?=95|98|NT|2000)」能匹配「Windows2000」中的「Windows」，但不能匹配「Windows3.1」中的「Windows」。

(?!pattern) 非獲取匹配，正向否認預查，例如「Windows(?!95|98|NT|2000)」能匹配「Windows3.1」中的「Windows」，但不能匹配「Windows2000」中的「Windows」。

(?<=pattern) 非獲取匹配，反向確定預查。例如，「(?<=95|98|NT|2000)Windows」能匹配「2000Windows」中的「Windows」，但不能匹配「3.1Windows」中的「Windows」。

(?<!pattern) 非獲取匹配，反向否認預查，與正向否認預查相似，只是方向相反。例如「(?<!95|98|NT|2000)Windows」能匹配「3.1Windows」中的「Windows」，但不能匹配「2000Windows」中的「Windows」。

 

---

 

RegExp對象

RegExp實例方法

    var pattern = /js/;
    var pattern = new RegExp('js');

獲取全部的匹配

    var str = '1.js 2.js 3.js';
    var pattern = /js/g;
    var total = 0,
        match = '',
        result;

    while ((result = pattern.exec(str)) != null) {
        total++;
        match += '第' + total + '個匹配到的是：' + result[0] + ', 它的位置是：' + result.index + '\n';
    }
    match += '共找到' + total + '處匹配\n';
    console.log(str);
    console.log(match);

valueOf：返回一個 Number 對象的基本數字值。

toString()：把數字轉換爲字符串，使用指定的基數。

toLocalString()：把數字轉換爲字符串，使用本地數字格式順序

    var pattern = new RegExp('a\\nb')
    console.log(pattern.toString());//a\nb
    console.log(pattern.toLocaleString());//a\nb
    console.log(pattern.valueOf() === pattern); //a\nb

RegExp實例屬性

ignoreCase：是一個只讀的布爾值，看這個正則表達式是否帶有修飾符i

multiline：是一個只讀的布爾值，看這個正則表達式是否帶有修飾符m

source：是一個只讀的字符串，包含正則表達式的文本

lastIndex：是一個可讀/寫的整數，若是匹配模式中帶有g修飾符，這個屬性存儲在整個字符串中下一次檢索的開始位置，這個屬性會被exec( ) 和 test( ) 方法用到

    var str = 'js js js';
    var pattern = new RegExp('js', 'ig');
    console.log(pattern.ignoreCase); //true
    console.log(pattern.global); //true
    console.log(pattern.multiline); //false
    console.log(pattern.source); //js
    console.log(pattern.exec(str));
    console.log(pattern.lastIndex); //0
    console.log(pattern.exec(str));
    console.log(pattern.lastIndex); //3

RegExp構造函數屬性列表

exec( )接受一個參數時（即要應用模式的字符串），返回包含第一個匹配項信息的數組

包含兩個額外的屬性

index：表示匹配文本的第一個字符的位置

input：表示存放的爲被檢索 的字符串string

lastIndex屬性，返回匹配內容的最後一個索引位置，也就是下一個匹配的開始位置，注意字符串索引從0開始

lastMatch($&)屬性，只讀屬性，若是沒有匹配信息，則該屬性的值爲空字符串

lastParen屬性 只讀靜態屬性，該屬性返回在最近一次匹配檢測中所獲得的最後一個子匹配的值，若是沒有子匹配則返回空字符串

leftContext屬性 返回匹配內容左側的字符信息 該屬性的初始值爲空字符串 ，若是有相應的匹配該屬性的值就會改變

    var str = 'js js js';
    var pattern = /(j)s/;
    pattern.exec(str);
    console.log(RegExp.input);//js js js
    console.log(RegExp.$_); // = input
    console.log(RegExp['$_']); // = input
    console.log(RegExp.lastMatch); //js
    console.log(RegExp['$&']); // = lastMatch
    console.log(RegExp.leftContext);
    console.log(RegExp['$`']); // = leftContext
    console.log(RegExp.rightContext);
    console.log(RegExp["$'"]); // = rightContext
    console.log(RegExp.lastParen);
    console.log(RegExp["$+"]); // = lastParen

String對象中與正則表達式相關的方法

search()

    var str = 'html js js';
    var pattern = /js/g;
    console.log(str.search(pattern));//5

match()

    var str = 'js1\njs2\njs3';
    var pattern = /^js/mg;
    console.log(str);
    console.log(str.match(pattern));

split()

    var str = 'html ,   css  ,   js';
    var pattern = /\s*,\s*/; // 包括,左右出現空格也能匹配到
    console.log(str.split(pattern));

replace()

    var str = 'I love js';
    var pattern = /(js)/;
    document.write(str.replace(pattern, '<strong style="color: red;">$1</strong>'));\

用*屏蔽相關文字

    var str = '中國軍隊和阿扁一塊兒辦證';
    var pattern = /國軍|阿扁|辦證/g;
    console.log(str.replace(pattern, '*'));

 

幾個文字對應幾個*

    var str = '中國軍隊和阿扁一塊兒辦證';
    var pattern = /國軍|阿扁|辦證/g;
    console.log(str.replace(pattern, function ($0) {
        var result = '';
        for (var i = 0; i < $0.length; i++) {
            result += '*';
        }
        return result;
    }));

經常使用的正則表達式

1.QQ

         全是數字

         首位不能爲0

         最少5位(10000)

         目前最多11位？

    /^[1-9]\d{4,10}$/
    /^[1-9]\d{4,}$/

2.暱稱

         中、英文、數字以及下劃線

         2-18位

    /^[\u4e00-\u9fa5a-zA-Z0-9_]{2,18}$/
    /^[\u4e00-\u9fa5\w]{2,18}$/

3.密碼

         6-16位

         不能用空白字符\s

    /^\S{6,16}$/
    /^[\w~!@#$%^\[\]]{6,16}$/

4.去除字符串首尾的空白字符

    var str = '        Alex         ';
    var pattern = /^\s+|\s+$/g;
    console.log(str.replace(pattern, ''));

函數封裝

    function trim(str) {
        return str.replace(/^\s+/, '').replace(/\s+$/, '');
    }
    var str = '        Alex         ';
    console.log('|' + trim(str) + '|');

5.-轉駝峯

    var str = 'background-color';
    var pattern = /-([a-z])/gi;
    console.log(str.replace(pattern, function (all, letter) {
        return letter.toUpperCase();
    }));

函數封裝

    function toCamelCase(str) {
        return str.replace(pattern, function (all, letter) {
            return letter.toUpperCase();
        })
    }

6.匹配HTML標籤

    var str = '<p class="odd" id="odd">123</p>';
    var pattern = /<[^>]+>/g;// <>中間沒有再出現>
    console.log(str.match(pattern));

7.郵箱

                   alex@yahoo.com.cn

                   alex_1@yahoo.com.cn

                   alex_1.a-sdasd.asdasdas.com@yah-o_o.com.adasdsd.cn

    /(?:\w+\.)*\w+@(?:\w+\.)+[a-z]/i
    /^[a-z0-9]+(?:[._-][a-z0-9]+)*@[a-z0-9]+(?:[._-][a-z0-9]+)*\.[a-z]{2,4}$/i

8.URL

         (協議:\/\/)主機名(:端口號)(/路徑)

ftp|http|https|mailto|file:///

    /^(https?:\/\/)?([^:\/]+)(:\d+)?(\/.*)?$/

九、匹配主機名

         /[^:\/]+/

         -www.-imos-oc.casfasf.sadasd.com

    /[a-z0-9]|[a-z0-9][-a-z0-9]*[a-z0-9]/i
    /^([a-z0-9]\.|[a-z0-9][-a-z0-9]*[a-z0-9]\.)*(com|edu|gov|net|org|[a-z]{2})$/i
    /^([a-z0-9]\.|[a-z0-9][-a-z0-9]*[a-z0-9]\.)*([a-z]+)$/i

十、匹配全部字符

    /[\w\W]/ 或
    /[\d\D]/ 或
    /[\s\S]/ 或
    /[^]/

十一、分別寫出匹配正整數、負整數以及既能匹配正整數，也能匹配負整數的正則表達式

提示：1.注意0是整數，不是正整數，也不是負整數

    正整數： /[1-9]\d*/
    負整數： /-[1-9]\d*/
    正整數和負整數：/-?[1-9]\d*/
整數：/0|-?[1-9]\d*/

十二、?禁止貪婪模式，請匹配第一個[]以及它裏面的內容

    var str = 'js[javascript];html[hyper text markup language];css[cascading style sheet];';
    var pattern = /\[.*?\]/; 
    console.log(pattern.exec(str));

1三、html標籤的屬性值既能夠放在""中，也能夠放在''中，例如<p class="box" id='box'></p>

寫出既能匹配""中內容，又可以匹配''中內容的正則表達式  

    /(["'])[^"']\1/

1四、現有字符串'Windows98, WindowsXP, Windows7'，請分別寫出匹配後面是XP的Windows和後面不是7的Windows的兩個正則表達式

提示：1.前瞻性匹配和負向前瞻性匹配

    /Windows(?=XP)/
    /Windows(?!7)/

1五、RegExp對象

匹配字符串'weekend,endfor,end'中全部的end，並分別打印出其中的字母e

提示：1.全局匹配 2.exec循環打印

()包起來的會被存儲到結果中

    var str = 'weekend,endfor,end';
    var pattern =/(e)nd/g;
    var result;
    while((result = pattern.exec(str)) != null) {
        console.log(result[1]);
    }

String對象與正則表達式相關的方法

1六、找出字符串'110報警120急救119火警114查詢'中的全部數字，並打印出來

提示：1.全局匹配 2.match

    var str = '110報警120急救119火警114查詢';
    var pattern =/\d+/g;
    console.log(str.match(pattern));

1七、找出字符串'asdfgaaaafdgdgaaaadgsxcvcxva'中出現次數最多的字符，並打印出其出現的次數

提示：1.利用數組排序 2.利用引用匹配相同的字符

    var str = 'asdfgaaaafdgdgaaaadgsxcvcxva';
    var arr = str.split(''); // 轉換成數組
    str = arr.sort().join(''); // 排序以後再拼成字符串，此時相同的字符緊挨在了一塊兒
    var value = ''; // 出現次數最多的字符
    var count = 0; // 出現次數
    var pattern =/(\w)\1+/g; // 匹配緊挨着的相同字符
    str.replace(pattern, function ($0, $1) {
        // $0表示匹配到的全部相同字符，$1表示第一個分組匹配的字符，也就是單個字符
        if (count < $0.length) {
        // 若是$0.length>count，就表示此時匹配到的字符，到目前爲止是出現次數最多的
            count = $0.length;
            value = $1;
        }
    });
    console.log('出現次數最多的字符是：'+value+'，共出現'+count + '次');