了解正則運算式的作用

1. 掌握正則運算式的使用

• 創建正則運算式

  • 正則運算式組成

  • 邊界符

  • 字符類

• 正則測驗

正則運算式概述

1.什么是正則運算式

正則運算式（ Regular Expression ）是用于匹配字串中字符組合的模式，在JavaScript中，正則運算式也是物件，

正則表通常被用來檢索、替換那些符合某個模式（規則）的文本，例如驗證表單：用戶名表單只能輸入英文字母、數字或者下劃線， 昵稱輸入框中可以輸入中文(匹配)，此外，正則運算式還常用于過濾掉頁面內容中的一些敏感詞(替換)，或從字串中獲取我們想要的特定部分(提取)等 ，

2.正則運算式的特點

1. 靈活性、邏輯性和功能性非常的強，

2. 可以迅速地用極簡單的方式達到字串的復雜控制，

3. 對于剛接觸的人來說，比較晦澀難懂，比如：^\w+([-+.]\w+)@\w+([-.]\w+).\w+([-.]\w+)*$

正則運算式在js中的使用

1.正則運算式的創建

在 JavaScript 中，可以通過兩種方式創建一個正則運算式，

方式一：通過呼叫RegExp物件的建構式創建

let regexp = new RegExp(/123/);
console.log(regexp);

方式二：利用字面量創建 正則運算式

let rg = /123/;

2.測驗正則運算式

test() 正則物件方法，用于檢測字串是否符合該規則，該物件會回傳 true 或 false，其引數是測驗字串，

let rg = /123/;
console.log(rg.test(123)); // 匹配字符中是否出現123 出現結果為true
console.log(rg.test('abc')); // 匹配字符中是否出現123 未出現結果為false

正則運算式中的特殊字符

1.正則運算式的組成

一個正則運算式可以由簡單的字符構成，比如 /abc/，也可以是簡單和特殊字符的組合，比如 /ab*c/ ，其中特殊字符也被稱為元字符，在正則運算式中是具有特殊意義的專用符號，如 ^ 、$ 、+ 等，

參考檔案：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions

2.邊界符

正則運算式中的邊界符（位置符）用來提示字符所處的位置，主要有兩個字符

3.字符類

字符類表示有一系列字符可供選擇，只要匹配其中一個就可以了，所有可供選擇的字符都放在方括號內，

1. [ ] 方括號

表示有一系列字符可供選擇，只要匹配其中一個就可以了

let rg = /[abc]/; // 只要包含有a 或者 包含有b 或者包含有c 都回傳為true
console.log(rg.test('andy')); // true
console.log(rg.test('baby')); // true
console.log(rg.test('color')); // true
console.log(rg.test('red')); // false
let rg1 = /^[abc]$/; // 三選一 只有是a 或者是 b  或者是c 這三個字母才回傳 true
console.log(rg1.test('aa')); // false
console.log(rg1.test('a')); // true
console.log(rg1.test('b')); // true
console.log(rg1.test('c')); // true
console.log(rg1.test('abc')); // true
----------------------------------------------------------------------------------
let reg = /^[a-z]$/ // 26個英文字母任何一個字母回傳 true  - 表示的是a 到z 的范圍  
console.log(reg.test('a')); // true
console.log(reg.test('z')); // true
console.log(reg.test('A')); // false
-----------------------------------------------------------------------------------
// 字符組合
let reg1 = /^[a-zA-Z0-9]$/; // 26個英文字母(大寫和小寫都可以)任何一個字母回傳 true  
------------------------------------------------------------------------------------
//取反 方括號內部加上 ^ 表示取反，只要包含方括號內的字符，都回傳 false ，
let reg2 = /^[^a-zA-Z0-9]$/;
console.log(reg2.test('a')); // false
console.log(reg2.test('B')); // false
console.log(reg2.test(8)); // false
console.log(reg2.test('!')); // true

2.量詞符

量詞符用來設定某個模式出現的次數，

3.括號總結

1.大括號 量詞符. 里面表示重復次數

2.中括號 字符集合，匹配方括號中的任意字符.

3.小括號表示優先級

4.預定義類

預定義類指的是某些常見模式的簡寫方式.

4.正則替換replace

replace() 方法可以實作替換字串操作，用來替換的引數可以是一個字串或是一個正則運算式，

let str = 'andy和red';
let newStr = str.replace('andy', 'baby');
console.log(newStr)//baby和red
// 等同于 此處的andy可以寫在正則運算式內
let newStr2 = str.replace(/andy/, 'baby');
console.log(newStr2)//baby和red
// 全部替換
let str = 'abcabc'
let nStr = str.replace(/a/,'哈哈')
console.log(nStr) //哈哈bcabc
// 全部替換g
let nStr = str.replace(/a/a,'哈哈')
console.log(nStr) // 哈哈bc哈哈bc
// 忽略大小寫i
let str = 'aAbcAba';
let newStr = str.replace(/a/gi,'哈哈') // "哈哈哈哈bc哈哈b哈哈"

致讀者：

以上就是JavaScript進階篇的全部內容啦，如果你有耐心從最初的JavaScript入門學到了這里，那么恭喜你，你的JavaScript基礎就已經非常扎實了，可以考慮學習jq或者框架啦，

接下里我們會進入jq的學習 加油哦！！！

上一章：JavaScript 進階第十章（遞回）