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

来源:http://www.cnblogs.com/xiaohuochai/archive/2016/06/24/5612230.html
-Advertisement-
Play Games

[1]對象 [2]實例屬性 [3]構造函數屬性 [4]實例方法 ...


×
目錄
[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分別用於存儲第一、第二……第九個匹配的捕獲組
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章 方法


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 設計模式（八）：外觀模式
    這個模式是我覺得最好懂的模式。 外觀（Facade）模式 定義： 外觀模式是一種結構型模式。它為更大的代碼體提供了一個方便的高層次介面，能夠隱藏其底層的真實複雜性。簡單說就是——小介面有大智慧。 例子： 使用jQuery的$(el).css()或$(el).animate()方法時，實際上我們是在使 ...
  • (原) 2.1 Zookeeper原生API使用
    本文為原創文章，未經允許不得轉載 Zookeeper原生API使用 1、jar包引入，演示版本為3.4.6，非maven項目，可以下載jar包導入到項目中 2、創建zookeeper連接 ZooKeeper(java.lang.String connectString, int sessionTim ...
  • 【譯】Dependency Injection with Autofac
    先說下為什麼翻譯這篇文章，既定的方向是架構，然後為了學習架構就去學習一些架構模式、設計思想。 突然有一天發現依賴註入這種技能。為了使得架構可測試、易維護、可擴展，需要架構設計為松耦合類型，簡單的說也就是解耦。為瞭解耦前面的人提出各種理論，主要思想是控制反轉，而現在主流的主要是兩個：依賴註入、服務定位 ...
  • (原) 1.1 Zookeeper單機安裝
    本文為原創文章，未經允許不得轉載 zookeeper 單機安裝配置 1、安裝前準備 linux系統（此文環境為Centos6.5） Zookeeper安裝包，官網https://zookeeper.apache.org/,演示版本zookeeper-3.4.7.tar.gz linux系統（此文環境 ...
  • JQuery語法總結和註意事項
    1、關於頁面元素的引用 通過jquery的$()引用元素包括通過id、class、元素名以及元素的層級關係及dom或者xpath條件等方法，且返回的對象為jquery對象（集合對象），不能直接調用dom定義的方法。 2、jQuery對象與dom對象的轉換 只有jquery對象才能使用jquery定義 ...
  • HTML5 本地存儲 LocalStorage
    說到本地存儲，這玩意真是歷盡千辛萬苦才走到HTML5這一步，之前的歷史大概如下圖所示： 最早的Cookies自然是大家都知道，問題主要就是太小，大概也就4KB的樣子，而且IE6只支持每個功能變數名稱20個cookies，太少了。優勢就是大家 都支持，而且支持得還蠻好。很早以前那些禁用cookies的用戶也都 ...
  • JavaScript常用標簽和方法總結
    什麼是javascript？ (1) JavaScript是一種基於對象(Object)和事件驅動(Event Driven)並具有安全性能的 腳本語言。 (2) JavaScript是由Netscape公司開發的一種腳本語言，其編寫的程式可以嵌入到 HTML頁面中，並直接在瀏覽器中解釋執行。 (3 ...
  • 【總結】CSS透明度大彙總
    近年來，CSS不透明算得上是一種相當流行的技術，但在跨瀏覽器支持上，對於開發者來說，可以說是一件令人頭疼的事情。目前還沒有一個通用方法，以確保透明度設置可以在目前使用的所有瀏覽器上有效。 這篇彙總主要是提供一些CSS不透明的詳細介紹，代碼示例和解釋，以實現這項有用的CSS技術在您的項目中相容所有瀏覽 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類