js學習四-RegExp正規表示式
RegExp正規表示式
方法:
1.regexObj.test(str)
測試正規表示式與指定字串是否匹配,返回true/false
只要str裡包含了regexp就會返回true
匹配一個位置
- ^:起始位置或者是取反的意思
- $:結尾位置
- \b:單詞邊界
3.字元類
匹配一類字元中的一個
-[abc]:a或b或c
-[0-9]:一個數字
-[a-z]:一個字母
- . :任一字元(換行符)
-[^0-9]:非數字的字元
4.元字元
具有特殊意義的字元
- ^、$、\b
- \d:[0-9]
- \D:[^\d]
- \s:空白符
- \S:[^\s]
- \w:[A-Za-z0-9]
- \W:[^\w]
5.量詞
出現的次數
- {m,n}:m到n次
- *:{0,}
- ?:{0-1}
- +:{1,}
6.轉義符
需要匹配的字元是元字元
7.多選分支
|是“或”的意思
/thi(c|n)k/ === /thi[cn]k/
圖片檔案:/\.(png|jpg|jpeg|gif)$/
郵箱:/(.+)@163|126|188\.com/
8.捕獲
儲存匹配到的字串,日後再用
() :捕獲
(?:):不捕獲
方法:
①str.match(regexp) 返回一個陣列
②str.replace(regexp/substr,replacement)替換一個字元,每次只能替換一個
加上‘/g’表示在全域性範圍內替換
③regexpObj.exec(str)更強大的檢索
index
lastIndex
var url = 'http://list.jd.com/list.html?cat=9987,653,655&ev=exbrand_13539&go=0&JL=3_%E5%93%81%E7%89%8C_%E8%AF%BA%E5%9F%BA%E4%BA%9A%EF%BC%88NOKIA%EF%BC%89#J_crumbsBar'
var reg = /(http?:)\/\/([^\/]+)(\/[^\?]*)?)(\?[^#]*)?(#.*)?/;
var arr = url.match(reg)
程式碼:
/^http/.test("http://baidu.com")
true
/^http/.test("https://baidu.com")
true
/\.jpg$/.test("1.jpg")
true
/\.jpg$/.test("1.jpg cat")
false
/\bis\b/.test('this')
false
/\bis\b/.test('this is dog')
true
/^666$/.test('x666x')
false
/^666$/.test('666')
true
匹配手機號碼:
/^1[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$/.test('13456789535')
或者是
/^1\d\d\d\d\d\d\d\d\d\d$/.test('13456789535')
或者是
/^1\d{10}$/.test('13456789535')
true
/http:\/\//.test("http://baidu.com")
true
/.com$/.test("http://baidu.com")
true
Q:正規表示式中,量詞的貪婪模式與惰性模式有什麼區別?
課程中介紹的量詞都是貪婪模式(最常用的模式),量詞還有個較常用的模式是惰性模式。大家可以自學下這種模式,然後比較下貪婪模式與惰性模式有什麼區別。
貪婪模式:在匹配成功的前提下,儘可能多的去匹配;
惰性模式:在匹配成功的前提下,儘可能少的去匹配。
貪婪模式從整個字串開始檢視,不匹配則去掉最後一個字元,再檢視是否匹配,如此迴圈一直到匹配或字串空為止。
惰性模式只需要在貪婪量詞的後面加“?”從第一個字元開始,不匹配則增加一個字元,如此迴圈直到字串結束。惰性模式只被部分NFA引擎支援。
方法:
1.regexObj.test(str)
測試正規表示式與指定字串是否匹配,返回true/false
只要str裡包含了regexp就會返回true
code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>RegExp</title>
</head>
<body>
<input type="text" onblur="check(this)" onfocus="reset(this)" name="">
<script type="text/javascript">
function check(numberInput) {
var value = numberInput.value;
if(!/6666/.test(value)){
numberInput.style.borderColor = 'red';
}
}
function reset(numberInput) {
numberInput.style.bordeColor = '';
}
</script>
</body>
</html>
2.錨點匹配一個位置
- ^:起始位置或者是取反的意思
- $:結尾位置
- \b:單詞邊界
3.字元類
匹配一類字元中的一個
-[abc]:a或b或c
-[0-9]:一個數字
-[a-z]:一個字母
- . :任一字元(換行符)
-[^0-9]:非數字的字元
4.元字元
具有特殊意義的字元
- ^、$、\b
- \d:[0-9]
- \D:[^\d]
- \s:空白符
- \S:[^\s]
- \w:[A-Za-z0-9]
- \W:[^\w]
5.量詞
出現的次數
- {m,n}:m到n次
- *:{0,}
- ?:{0-1}
- +:{1,}
6.轉義符
需要匹配的字元是元字元
7.多選分支
|是“或”的意思
/thi(c|n)k/ === /thi[cn]k/
圖片檔案:/\.(png|jpg|jpeg|gif)$/
郵箱:/(.+)@163|126|188\.com/
8.捕獲
儲存匹配到的字串,日後再用
() :捕獲
(?:):不捕獲
方法:
①str.match(regexp) 返回一個陣列
②str.replace(regexp/substr,replacement)替換一個字元,每次只能替換一個
加上‘/g’表示在全域性範圍內替換
③regexpObj.exec(str)更強大的檢索
index
lastIndex
var url = 'http://list.jd.com/list.html?cat=9987,653,655&ev=exbrand_13539&go=0&JL=3_%E5%93%81%E7%89%8C_%E8%AF%BA%E5%9F%BA%E4%BA%9A%EF%BC%88NOKIA%EF%BC%89#J_crumbsBar'
var reg = /(http?:)\/\/([^\/]+)(\/[^\?]*)?)(\?[^#]*)?(#.*)?/;
var arr = url.match(reg)
程式碼:
/^http/.test("http://baidu.com")
true
/^http/.test("https://baidu.com")
true
/\.jpg$/.test("1.jpg")
true
/\.jpg$/.test("1.jpg cat")
false
/\bis\b/.test('this')
false
/\bis\b/.test('this is dog')
true
/^666$/.test('x666x')
false
/^666$/.test('666')
true
匹配手機號碼:
/^1[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$/.test('13456789535')
或者是
/^1\d\d\d\d\d\d\d\d\d\d$/.test('13456789535')
或者是
/^1\d{10}$/.test('13456789535')
true
/http:\/\//.test("http://baidu.com")
true
/.com$/.test("http://baidu.com")
true
Q:正規表示式中,量詞的貪婪模式與惰性模式有什麼區別?
課程中介紹的量詞都是貪婪模式(最常用的模式),量詞還有個較常用的模式是惰性模式。大家可以自學下這種模式,然後比較下貪婪模式與惰性模式有什麼區別。
貪婪模式:在匹配成功的前提下,儘可能多的去匹配;
惰性模式:在匹配成功的前提下,儘可能少的去匹配。
貪婪模式從整個字串開始檢視,不匹配則去掉最後一個字元,再檢視是否匹配,如此迴圈一直到匹配或字串空為止。
惰性模式只需要在貪婪量詞的後面加“?”從第一個字元開始,不匹配則增加一個字元,如此迴圈直到字串結束。惰性模式只被部分NFA引擎支援。
相關文章
- JS正規表示式精簡教程(JavaScript RegExp 物件)JSJavaScript物件
- 正規表示式RegExp.input
- JavaScript RegExp(正規表示式) 物件JavaScript物件
- 學習正規表示式(js、C#)JSC#
- 通過js正規表示式例項學習正規表示式基本語法JS
- js正規表示式基本語法學習JS
- js加固之正規表示式學習筆記JS筆記
- JS正規表示式從入門到入土(8)—— REGEXP物件屬性JS物件
- 正規表示式 【四】
- Oracle 正規表示式函式-REGEXP_REPLACE 使用例子Oracle函式
- Go 正規表示式學習Go
- ES9的新特性:正規表示式RegExp
- js正規表示式速查JS
- 正規表示式學習和練習
- 正規表示式學習筆記筆記
- 如何快速學習正規表示式
- 正規表示式入門學習
- oracle正規表示式regexp_like的用法詳解Oracle
- Day1-學習筆記-js之正規表示式筆記JS
- 正規表示式例項蒐集,通過例項來學習正規表示式。
- JS正規表示式入門JS
- JS正規表示式驗證JS
- JS正規表示式總結JS
- JS助記 ----- 正規表示式JS
- JS基礎:正規表示式JS
- JS中的正規表示式JS
- JS金額正規表示式JS
- Python學習筆記 - 正規表示式Python筆記
- java 正規表示式語法學習Java
- 正規表示式學習(2)---字元特性字元
- JS常用正規表示式及驗證時間的正規表示式JS
- 正規表示式複習
- Python正規表示式初識(四)Python
- 正規表示式(初學)
- js中的正規表示式(1)JS
- JS筆記(15): 正規表示式JS筆記
- 關於JS的正規表示式JS
- JS正規表示式的驗證JS
- JavaScript正規表示式學習筆記(一)JavaScript筆記