RegExp -- 常見四種正則方法

1、正則表達式

一、match()方法

調用

let str = "夢的翅膀受傷了!"
let res = str.match('翅膀')

match() 方法可在字符串內檢索指定的值，這個校驗方法有點相似於數組/字符串的indexOf()和lastIndexOf()方法，只不過這兩個方法返回的是指定值首次出現的下標索引，而match()返回兩種結果：

1.正常的校驗指定字符，返回的則是一個不知道是數組，仍是對象的字符數據，經過索引0能夠獲取返回的指定校驗字符，可是能夠經過.key的方式獲取指定校驗字符首次出現的下標索引和數據校驗來源的原字符串

let str = "夢的翅膀受傷了!"
let res = str.match('翅膀')
console.log(res)

// 打印結果
["翅膀", index: 2, input: "夢的翅膀受傷了!", groups: undefined]

// 匹配結果獲取
console.log(res[0])  // 翅膀

// 獲取index
console.log(res[1]) // 報錯
console.log(res.index)  // 2

// 獲取匹配數據來源
console.log(res.input)  // 夢的翅膀受傷了!

Tips

經過字符串檢索查找，只會返回第一次查找到要查找元素

2.若是是經過正則方式校驗，若是沒有使用g修飾符，則跟字符串檢索沒有多大區別，若是使用了g修飾符，則返回的是字符串中出現的指定字符的全部值得數組集合，不會再有index和input等屬性，純粹是一個匹配結果值得數組集合

let str = "夢的翅膀受傷了!飛翔的翅膀"
let res = str.match(/翅膀/g)
console.log(res)

// 打印結果
["翅膀", "翅膀"]

Tips 這個方法返回得是要校驗的字符的字符數組集合，若是沒有匹配，則返回null

二、replace()方法

這個方法是用來匹配字符串裏面指定要查找的字符串，並將匹配到的字符串替換成指定的字符串

這個方法有兩個參數，第一個參數能夠是正則表達式，也能夠是字符串，第二個參數就是匹配後替換的數據，或者生成替換文本的函數

let str = "夢的翅膀受傷了!飛翔的翅膀"
let res = str.replace('翅膀', '鳥兒')
console.log(res)

// 打印結果
夢的鳥兒受傷了!飛翔的翅膀

正則

使用正則的時候，記得加上g修飾符，不然只會替換第一個

let str = "夢的翅膀受傷了!飛翔的翅膀"
let res = str.replace(/翅膀/, '鳥兒')
console.log(res)

// 打印結果
夢的鳥兒受傷了!飛翔的翅膀

let str = "夢的翅膀受傷了!飛翔的翅膀"
let res = str.replace(/翅膀/g, '鳥兒')
console.log(res)

// 打印結果
夢的鳥兒受傷了!飛翔的鳥兒

參數二爲函數

若是參數二是函數而不是字符串，在這種狀況下，每一個匹配都調用該函數，它返回的字符串將做爲替換文本使用。該函數的第一個參數是匹配模式的字符串。接下來的參數是與模式中的子表達式匹配的字符串，能夠有 0 個或多個這樣的參數。接下來的參數是一個整數，聲明瞭匹配在 stringObject 中出現的位置。最後一個參數是 stringObject 自己

官網意思是有四個參數，第一個參數是匹配的字符串，第二個是子正則表達式匹配的字符串，第三個匹配的字符串的索引，第四個就是原字符串

let str = "夢的翅膀受傷了!飛翔的翅膀"
let res = str.replace(/翅膀/, function (current, index, input, strs) {
  console.log(current+ '-' +nextStr+ '-' +index+ '-' +strs)
  return '鳥兒'
})
console.log(res)

// 打印結果
翅膀-2-夢的翅膀受傷了!飛翔的翅膀-undefined
夢的鳥兒受傷了!飛翔的翅膀

let hml = '<div><img src="http://www.baidu.com/images/1.png" /></div>'
let res = hml.replace(/<img[^>]* src\s*?=\s*?['"]([^'"]+)[^>]*>/gi, function (current, nextStr, index, strs) {
  console.log(current+ '-' +nextStr+ '-' +index+ '-' +strs)
  return '鳥兒'
})
console.log(res)

// 打印結果
<img src="http://www.baidu.com/images/1.png" />-http://www.baidu.com/images/1.png-5-<div><img src="http://www.baidu.com/images/1.png" /></div>
<div>鳥兒</div>

三、exec()方法

用來校驗傳入的字符串中指定的匹配，返回一個數組，存放匹配的結果，若是沒有匹配到，則返回null

返回數組的第零項元素是正則匹配到的值，第一項元素是正則表達式中第一個子表達式匹配的值，第二項元素是正則表達式中第二個茲表示匹配的值，以此類推，還會額外返回index和input屬性

let str = 'abcdefgabcdefg'
let reg = /b/
let res = reg.exec(str)
console.log(res)

// 打印結果
['b', index: 1, input: "abcdefgabcdefg"]

若是是全局匹配，則能夠經過循環語句，重複調用exec方法

let str = 'abcdefgabcdefg'
let reg = /b/g
let newRes
while ((newRes = reg.exec(str)) !== null) {
  console.log(newRes)
}

// 打印結果
["b", index: 1, input: "abcdefgabcdefg", groups: undefined]
["b", index: 8, input: "abcdefgabcdefg", groups: undefined]

四、test()方法

用於檢測一個字符串是否匹配指定內容，若是匹配則返回true，不匹配則返回false

let str = 'abcdefgabcdefg'
let reg = /b/g
let bl = reg.test(str)
console.log(bl)

// 打印結果
true