注意點:正則是使用到字串上的,在
javascript弱語言中有時候你可能會使用到數字的時候,注意也要轉換成字串
一、定義正則的方式
-
1、簡單直接的定義方式(常用這種方式)
var reg = /javascript/gi 複製程式碼 -
2、使用物件方式建立一個正則(這種方式的使用建立要匹配的內容是一個變數)
var reg = new RegExp('javascript', gi) 複製程式碼
二、元字元的認識
- 1、具有特殊意義的元字元
\：轉義字元，轉義後面字元所代表的含義^：以某一個元字元開始$：以某一個元字元結束\n：匹配一個換行符.：除了\n以外的任意字元\o：NUL字元(\u0000)\t：製表符(\u0009)\v：垂直製表符(\u000B)\f：換頁符(\u000C)\r：回車符(\u000D)
- 2、代表出現次數的量詞元字元
*：出現0到多次+：出現1到多次?：出現0次或者1次(或取消捕獲時候的貪婪性){n}：出現n次{n,m}：出現n到m次
三、修飾符的認識
x|y：x或y中的一個[xyz]：x或y或z中的一個[^xyz]：除了xyz以外的任意一個字元[a-z]：a-z之間的任何一個字元[^a-z]：除了a-z之間的任何一個字元\d：一個0~9之間的數字\D：除了0~9之間的數字以外的任何字元\b：一個邊界符\w：數字、字母、下劃線中的任意一個字元\s：匹配一個空白字元、空格()：分組，把一個大正則本身劃分成幾個小的正則，例如：var reg = /^(\d+)zhufeng(\d+)$/;
四、幾個修飾符
- 1、
g表示全域性匹配 - 2、
i表示忽視大小寫 - 3、
m表示可以多行匹配
五、[]的使用
-
1、在中括號中出現的所有的字元都是代表本身的意思的字元（沒有特殊含義）
var reg = /[.]/ //匹配到. var reg = /\./ //匹配到. 複製程式碼 -
2、表示任意一個字元
var reg = /[xyz]/ // 表示匹配x或y或者z var reg = /[a-zA-Z]/ // 表示a-z或者A-Z中任意一個 複製程式碼 -
3、中括號不識別兩位數
var reg = /^[12]$/; // --> 1或者2中的一個（符合[xyz]） var reg = /^[12-68]$/; // --> 1、2-6中的一個、8 三個中的一個 var reg = /^[\d]+$/; // 表示匹配一個或者多少數字 複製程式碼 -
4、取反操作
var reg = /[^abc]/; // 表示除了abc其它的字元 複製程式碼
六、()的作用(類似數學一樣的改變運算的優先順序)
-
1、分組的使用
var reg = /^18|19$/; // 18、19、181、189、119、819、1819這些都符合 var reg = /^(18|19)$/; // 只能18或者19 複製程式碼
七、正則中幾個重要的方法
-
1、
test方法用於測試給定的字串是否符合條件,返回true或者falsevar reg = /[x|y]/ reg.test('|') 複製程式碼 -
2、
match把所有和正則匹配的字元都獲取到(簡單理解就是提取內容)var str = 'hello JAVA and javascript'; str.match(/java/gi); // 返回["JAVA", "java"] 複製程式碼 -
3、
exec匹配(一步一步的執行)會返回一個
Array，第一個元素是匹配到的元素,第二個元素是匹配到的元素在字串中的位置,第三個元素是整個字串,如果沒有匹配到就返回nullvar str = 'hello JAVA and javascript'; var reg = /java/gi; reg.exec(str); // 返回["JAVA", index: 6, input: "hello JAVA and javascript"] reg.exec(str); // 返回["java", index: 15, input: "hello JAVA and javascript"] reg.exec(str); // 返回null 複製程式碼 -
4、
split切割(也許你會說字串本身就有split合併用正則的split)'a b c'.split(' '); // 返回["a", "b", "", "", "c"] 'a,b, c d'.split(/[\s\,]+/); // 返回["a", "b", "c", "d"] **下面這個是我專案中使用到了,文字高亮** var str = 'helloJAVAandjavascript'; str.split(/(java)/gi); // 返回["hello", "JAVA", "and", "java", "script"],然後再利用標籤拼接 複製程式碼 -
5、
replace替換,在字串中也提供了一個相同的方法-
使用字串的替換
var str = 'iceman2016iceman2017'; str.replace('iceman','shoushou'); 複製程式碼 -
使用正則的替換
var str = 'iceman2016iceman2017'; str.replace(/iceman/g, 'shoushou'); 複製程式碼 -
第二個引數還可以是函式
var str = 'iceman2016iceman2017'; str.replace(/iceman/g, function () { // 第一個引數是正則匹配到的, // 第二個引數是如果有分組就是匹配到分組的,如果沒有分組匹配到的字元在整個字元中的index // 第三個引數是原來的字元 // 第一次執行匿名函式輸出arguments的結果：["iceman", 0, "iceman2016iceman2017"] // 第二次執行匿名函式輸出arguments的結果：["iceman", 10, "iceman2016iceman2017"] console.log(arguments); return 'shoushou'; }); 複製程式碼 -
關於
replace第二個引數的說明var str = 'he12llo wo21rd'; str.replace(/o/g, function (all, letter,) { console.log(all) console.log('====',letter) // 返回是6，9 }); 複製程式碼var str = 'he12llo wo21rd'; str.replace(/(o)/g, function (all, letter,) { console.log(all) console.log('====',letter) // 返回是o, o }); 複製程式碼 -
replace的使用案例(轉換為駝峰命名)var s1 = 'foo-style-css'; s1 = s1.replace(/-(\w)/g, function (all, letter) { return letter.toUpperCase(); }) 複製程式碼
-
-
6、
search搜尋方法,搜尋到匹配的內容返回下標,否則返回-1var str = 'hello JAVA and javascript'; str.search(/java/i); 複製程式碼
八、關於$1....$9的認識
-
1、
()在正則中表示分組的意思 -
2、
$就是表示分組後的佔位符,其中0...9表示分組後的序列號 -
3、
$1...$9要和()分組結合起來使用 -
4、使用案例
var s="abcdefghijklmn"; var reg = /(a)(b)(c)(d)(e)(f)(g)(h)(i)(j)(k)(l)(m)(n)/gi; var result = s.replace(reg, '$1,$2,$3,$4,$5,$6,$7,$8,$9,$10,$11,$12,$13,$14'); // 返回結果:'a,b,c,d,e,f,g,h,i,j,k,l,m,n' 複製程式碼 -
5、駝峰改為中劃線
export const splitStr = (str) => str ? str.replace(/([A-Z])/g," $1").toLowerCase() : ''; 複製程式碼
九、部分案例
-
1、匹配身份證號碼
var reg = /^(\d{2})(\d{4})(\d{4})(\d{2})(\d{2})(?:\d{2})(\d)(?:\d|X)$/; var str = "350324202904190216"; str.match(reg) 複製程式碼 -
2、把數字轉換為大寫數字
var ary = ['零', '壹', '貳', '叄', '肆', '伍', '陸','柒', '捌', '玖', '拾']; '200801'.replace(/\d/g, (args1, args2, args3) => { // 第一個引數的匹配到的數字,第二個引數是匹配到的index,第三個引數的整個字串 console.log(args1, args2, args3) return ary[args1] }) 複製程式碼 -
3、英文首字母大寫
var str = 'hello word'; str.toLowerCase().replace(/( |^)[a-z]/g, (L) => L.toUpperCase()); 複製程式碼 -
4、匹配空字元
var reg = /^$/ reg.test(''); // 返回true 複製程式碼 -
5、匹配一個字元或者空格開始
var reg = /(^|\\s)(|\\s$)/; 複製程式碼 -
6、貨幣千分位
const currency = (str) => str.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 複製程式碼
十、擴充套件點
-
1、文字框需要輸入特殊字元
'.*'.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&') // 輸出結果:"\.\*" 複製程式碼