javascript類型系統——正則表達式RegExp類型

原文: javascript類型系統——正則表達式RegExp類型

×

目錄

[1]對象 [2]實例屬性 [3]靜態屬性 [4]實例方法

前面的話

　　前面已經介紹過javascript中正則表達式的基礎語法。javascript的RegExp類表示正則表達式，String和RegExp都定義了方法，使用正則表達式能夠進行強大的模式匹配和文本檢索與替換。本文將介紹正則表達式的RegExp對象，以及正則表達式涉及到的屬性和方法

 

對象

　　javascript中的正則表達式用RegExp對象表示，有兩種寫法：一種是字面量寫法；另外一種是構造函數寫法

Perl寫法

　　正則表達式字面量寫法，又叫Perl寫法，由於javascript的正則表達式特性借鑑自Perl

　　正則表達式字面量定義爲包含在一對斜槓(/)之間的字符，而且能夠設置3個標誌

var expression = /pattern/flags;

　　正則表達式的匹配模式支持下列3個標誌：

　　g:表示全局(global)模式，即模式將被應用於全部字符串，而非在發現第一個匹配項時當即中止

　　i:表示不區分大小寫(case-insensitive)模式，即在肯定匹配項時忽略模式與字符串的大小寫

　　m:表示多行(multiline)模式，即在到達一行文本末尾時還會繼續查找下一行中是否存在與模式匹配的項

//匹配字符串全部'at'的實例
var p = /at/g;
//test()方法返回一個布爾值表示是否能夠找到匹配項
console.log(p.test('ata'));//true
console.log(p.test('aba'));//false

RegExp構造函數

　　和普通的內置對象同樣，RegExp正則表達式對象也支持new+RegExp()構造函數的形式

　　RegExp構造函數接收兩個參數：要匹配的字符串模式(pattern)和可選的標誌字符串(flags)，標誌字符串和字面量的三個標誌含義相同：'g'、'i'、'm'

　　RegExp構造函數的兩個參數都是字符串。且使用字面量形式定義的任何表達式均可使用構造函數

//匹配字符串全部'at'的實例
var p1 = /at/g;
//同上
var p2 = new RegExp('at','g');

　　[注意]ECMAScript3規範規定，一個正則表達式直接量會在執行到它時轉換爲一個RegExp對象，同一段代碼所表示正則表達式直接量的每次運算都返回同一個對象。ECMAScript5規範則作了相反的規定，同一段代碼所表示的正則表達式直接量的每次運算都返回新對象。IE6-8一直是按照ECMAScript5規範的方式實現的，因此並無兼容性問題

　　因爲正則表達式字面量並不支持變量，因此若是正則表達式中出現變量只能使用RegExp構造函數以字符串拼接的形式，將變量拼接到RegExp構造函數的參數中

　　【tips】經過類名classname獲取元素

function getByClass(obj,classname){
    var elements = obj.getElementsByTagName('*');
    var result = [];
    var pattern = new RegExp( '(^|\\s)'+ classname + '(\\s|$)');
    for(var i = 0; i < elements.length; i++){
        if(pattern.test(elements[i].className)){
            result.push(elements[i]);
        }
    }
    return result;
}

 

實例屬性

　　每一個RegExp實例對象都包含以下5個屬性

global:　　   布爾值，表示是否設置了g標誌
ignoreCase:  布爾值，表示是否設置了i標誌
lastIndex:   整數，表示開始搜索下一個匹配項的字符位置，從0算起
multiline:   布爾值，表示是否設置了標誌m
source: 　　  正則表達式的字符串表示，按照字面量形式而非傳入構造函數中的字符串模式返回

var pattern = new RegExp('\\[bc\\]at','i');
console.log(pattern.global);//false
console.log(pattern.ignoreCase);//true    
console.log(pattern.multiline);//false
console.log(pattern.lastIndex);//0
console.log(pattern.source);//'\[bc\]at'

　　若是使用RegExp的exec()或test()函數，而且設定了全局模式'g'，正則表達式的匹配就會從lastIndex的位置開始，而且在每欠匹配成功以後從新設定lastIndex。這樣，就能夠在字符串中重複迭代，依次尋找各個匹配結果。可是，若是須要對不一樣字符串調用同一個RegExp的exec()或test()方法，這個變量也也可能會帶來意料以外的匹配結果，因此在更換字符串時，要顯式地將RegExp的lastIndex置爲0

//exec()方法以數組形式返回匹配項
var p = /\w/g;
var s = 'ab';
console.log(p.lastIndex);//0
console.log(p.exec(s));//['a']
console.log(p.lastIndex);//1
console.log(p.exec(s));//['b']
console.log(p.lastIndex);//2
console.log(p.exec(s));//null
console.log(p.lastIndex);//0

var p = /\w/g;
var s1 = 'ab';
var s2 = 'ba';
console.log(p.lastIndex);//0
console.log(p.exec(s1));//['a']
console.log(p.lastIndex);//1
console.log(p.exec(s2));//['a']
console.log(p.lastIndex);//2

 

構造函數屬性

　　RegExp構造函數屬性被當作靜態屬性，這些屬性基於所執行的最近一次正則表達式操做而變化

　　有兩種方式訪問它們，即長屬性名和短屬性名。短屬性名大都不是有效的ECMAScript標識符，因此必須經過方括號語法來訪問它們

長屬性名        短屬性名       　　　　     說明
input             $_                最近一次要匹配的字符串
lastMatch         $&                最近一次的匹配項
lastParen         $+                最近一次匹配的捕獲組
leftContext       $`                input字符串中lastMatch以前的文本
multiline         $*                布爾值，表示是否全部表達式都使用多行模式
rightContext      $'                Input字符串中lastMarch以後的文本

　　使用這些屬性，能夠從exec()方法或test()方法執行的操做中提取出更具體的信息

//test()用於測試一個字符串是否匹配某個正則表達式，並返回一個布爾值
var text = 'this has been a short summer';
var pattern = /(.)hort/g;
if(pattern.test(text)){
    console.log(RegExp.input);//'this has been a short summer'
    console.log(RegExp.leftContext);//'this has been a '
    console.log(RegExp.rightContext);//' summer'
    console.log(RegExp.lastMatch);//'short'
    console.log(RegExp.lastParen);//'s'
    console.log(RegExp.multiline);//false
    console.log(RegExp['$_']);//'this has been a short summer'
    console.log(RegExp['$`']);//'this has been a '
    console.log(RegExp["$'"]);//' summer'
    console.log(RegExp['$&']);//'short'
    console.log(RegExp['$+']);//'s'
    console.log(RegExp['$*']);//false        
}

　　javascript有9個用於存儲捕獲組的構造函數屬性，在調用exec()或test()方法時，這些屬性會被自動填充

　　[注意]理論上，應該保存整個表達式匹配文本的RegExp.$0並不存在，值爲undefined

//RegExp.$1\RegExp.$2\RegExp.$3……到RegExp.$9分別用於存儲第1、第二……第九個匹配的捕獲組
var text = 'this has been a short summer';
var pattern = /(..)or(.)/g;
if(pattern.test(text)){
    console.log(RegExp.$1);//sh
    console.log(RegExp.$2);//t
}

 

實例方法

　　RegExp對象的實例方法共5個，分爲兩類。包括toString()、toLocalString()、valueOf()這3種對象通用方法和test()、exec()正則匹配方法

對象通用方法

　　RegExp對象繼承了Object對象的通用方法toString()、toLocaleString()、valueOf()這三個方法

【toString()】

　　toString()方法返回正則表達式的字面量

【toLocaleString()】

　　toLocaleString()方法返回正則表達式的字面量

【valueOf()】

　　valueOf()方法返回返回正則表達式對象自己

　　[注意]不論正則表達式的建立方式是哪一種，這三個方法都只返回其字面量形式

var pattern = new RegExp('[bc]at','gi');
console.log(pattern.toString()); // '/[bc]at/gi'
console.log(pattern.toLocaleString()); // '/[bc]at/gi'
console.log(pattern.valueOf()); // /[bc]at/gi

var pattern = /[bc]at/gi;
console.log(pattern.toString()); // '/[bc]at/gi'
console.log(pattern.toLocaleString()); // '[bc]at/gi'
console.log(pattern.valueOf()); // /[bc]at/gi

正則匹配方法

　　正則表達式RegExp對象的正則匹配方法只有兩個：分別是exec()和test()

【exec()】

　　exec()方法專門爲捕獲組而設計，接受一個參數，即要應用模式的字符串。而後返回包含匹配項信息的數組，在沒有匹配項的狀況下返回null

　　在匹配項數組中，第一項是與整個模式匹配的字符串，其餘項是與模式中的捕獲組匹配的字符串，若是模式中沒有捕獲組，則該數組只包含一項

　　返回的數組包含兩個額外的屬性：index和input。index表示匹配項在字符串的位置，input表示應用正則表達式的字符串

var text = 'mom and dad and baby and others';
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
console.log(pattern,matches);
//pattern.lastIndex:20
//matches[0]:'mom and dad and baby'
//matches[1]:' and dad and baby'
//matches[2]:' and baby'
//matches.index:0
//matches.input:'mom and dad and baby and others'   

　　對於exec()方法而言，即便在模式中設置了全局標誌(g)，它每次也只會返回一個匹配項。在不設置全局標誌的狀況下，在同一個字符串上屢次調用exec()，將始終返回第一個匹配項的信息；而在設置全局標誌的狀況下，每次調用exec()都會在字符串中繼續查找新匹配項

var text = 'cat,bat,sat,fat';
var pattern1 = /.at/;
var matches = pattern1.exec(text);
console.log(pattern1,matches);
//pattern1.lastIndex:0
//matches[0]:'cat'
//matches.index:0
//matches.input:'cat,bat,sat,fat'

var text = 'cat,bat,sat,fat';
matches = pattern1.exec(text);    
console.log(pattern1,matches);    
//pattern1.lastIndex:0
//matches[0]:'cat'
//matches.index:0
//matches.input:'cat,bat,sat,fat'

var text = 'cat,bat,sat,fat';
var pattern2 = /.at/g;
var matches = pattern2.exec(text);
console.log(pattern2,matches);    
//pattern2.lastIndex:3
//matches[0]:'cat'
//matches.index:0
//matches.input:'cat,bat,sat,fat'

var text = 'cat,bat,sat,fat';
matches = pattern2.exec(text);
console.log(pattern2,matches);    
//pattern2.lastIndex:7
//matches[0]:'bat'
//matches.index:4
//matches.input:'cat,bat,sat,fat'    

　　【tips】用exec()方法找出匹配的全部位置和全部值

var string = 'j1h342jg24g234j 3g24j1';
var pattern = /\d/g;
var valueArray = [];//值
var indexArray = [];//位置
var temp;
while((temp=pattern.exec(string)) != null){
    valueArray.push(temp[0]);
    indexArray.push(temp.index);  
}
//["1", "3", "4", "2", "2", "4", "2", "3", "4", "3", "2", "4", "1"] [1, 3, 4, 5, 8, 9, 11, 12, 13, 16, 18, 19, 21]
console.log(valueArray,indexArray); 

【test()】

　　test()方法用來測試正則表達式可否在字符串中找到匹配文本，接收一個字符串參數，匹配時返回true，不然返回false

var text = '000-00-000';
var pattern = /\d{3}-\d{2}-\d{4}/;
if(pattern.test(text)){
    console.log('The pattern was matched');
}

　　一樣地，在調用test()方法時，會形成RegExp對象的lastIndex屬性的變化。若是指定了全局模式，每次執行test()方法時，都會從字符串中的lastIndex偏移值開始嘗試匹配，因此用同一個RegExp屢次驗證不一樣字符串，必須在每次調用以後，將lastIndex值置爲0

var pattern = /^\d{4}-\d{2}-\d{2}$/g;
console.log(pattern.test('2016-06-23'));//true
console.log(pattern.test('2016-06-23'));//false

//正確的作法應該是在驗證不一樣字符串前，先將lastIndex重置爲0
var pattern = /^\d{4}-\d{2}-\d{2}$/g;
console.log(pattern.test('2016-06-23'));//true
pattern.lastIndex = 0;
console.log(pattern.test('2016-06-23'));//true

　　前面介紹過，javascript有9個用於存儲捕獲組的構造函數屬性，在調用exec()或test()方法時，這些屬性會被自動填充

　　[注意]理論上，應該保存整個表達式匹配文本的RegExp.$0並不存在，值爲undefined

if(/^(\d{4})-(\d{2})-(\d{2})$/.test('2016-06-23')){
    console.log(RegExp.$1);//'2016'
    console.log(RegExp.$2);//'06'
    console.log(RegExp.$3);//'23'
    console.log(RegExp.$0);//undefined
}

 

參考資料

【1】 阮一峯Javascript標準參考教程——標準庫RegExp對象 http://javascript.ruanyifeng.com/stdlib/regexp.html【2】《正則指引》第12章 JavaScript【3】《javascript權威指南(第6版)》第10章 正則表達式的模式匹配【4】《javascript高級程序設計(第3版)》第5章 引用類型【5】《javascript語言精粹(修訂版)》第8章 方法