JS正則表達式的使用方法是什么

JS正則表達式的使用方法是什么

正則表達式（Regular Expression，簡稱 regex 或 regexp）是一種強大的工具，用于匹配、查找和替換文本中的特定模式。在 JavaScript 中，正則表達式通過 RegExp 對象來實現，并且可以直接在字符串方法中使用。本文將介紹 JavaScript 中正則表達式的基本使用方法。

1. 創建正則表達式

在 JavaScript 中，正則表達式可以通過兩種方式創建：

1.1 字面量形式

使用兩個斜杠 / 包裹正則表達式模式：

const regex = /pattern/flags;

• pattern：正則表達式的模式。
• flags：可選的標志，用于指定匹配的方式，如 g（全局匹配）、i（忽略大小寫）、m（多行匹配）等。

例如：

const regex = /hello/i; // 匹配 "hello"，忽略大小寫

1.2 構造函數形式

使用 RegExp 構造函數創建正則表達式：

const regex = new RegExp('pattern', 'flags');

例如：

const regex = new RegExp('hello', 'i'); // 匹配 "hello"，忽略大小寫

2. 正則表達式的常用方法

2.1 test() 方法

test() 方法用于檢測字符串中是否包含與正則表達式匹配的內容。如果匹配成功，返回 true，否則返回 false。

const regex = /hello/;
console.log(regex.test('hello world')); // true
console.log(regex.test('hi world')); // false

2.2 exec() 方法

exec() 方法用于在字符串中執行正則表達式匹配。如果找到匹配項，返回一個數組，包含匹配的結果和捕獲組；如果沒有找到匹配項，返回 null。

const regex = /hello/;
const result = regex.exec('hello world');
console.log(result); // ["hello", index: 0, input: "hello world", groups: undefined]

2.3 match() 方法

match() 是字符串的方法，用于在字符串中查找與正則表達式匹配的內容。如果找到匹配項，返回一個數組；如果沒有找到匹配項，返回 null。

const str = 'hello world';
const result = str.match(/hello/);
console.log(result); // ["hello", index: 0, input: "hello world", groups: undefined]

2.4 replace() 方法

replace() 是字符串的方法，用于替換字符串中與正則表達式匹配的內容。

const str = 'hello world';
const newStr = str.replace(/hello/, 'hi');
console.log(newStr); // "hi world"

2.5 search() 方法

search() 是字符串的方法，用于查找字符串中與正則表達式匹配的內容。如果找到匹配項，返回匹配項的起始位置；如果沒有找到匹配項，返回 -1。

const str = 'hello world';
const position = str.search(/world/);
console.log(position); // 6

3. 正則表達式的常用模式

3.1 字符類

• \d：匹配數字字符，等價于 [0-9]。
• \D：匹配非數字字符，等價于 [^0-9]。
• \w：匹配字母、數字或下劃線，等價于 [a-zA-Z0-9_]。
• \W：匹配非字母、數字或下劃線的字符，等價于 [^a-zA-Z0-9_]。
• \s：匹配空白字符（空格、制表符、換行符等）。
• \S：匹配非空白字符。

3.2 量詞

• *：匹配前面的模式 0 次或多次。
• +：匹配前面的模式 1 次或多次。
• ?：匹配前面的模式 0 次或 1 次。
• {n}：匹配前面的模式恰好 n 次。
• {n,}：匹配前面的模式至少 n 次。
• {n,m}：匹配前面的模式至少 n 次，至多 m 次。

3.3 邊界匹配

• ^：匹配字符串的開頭。
• $：匹配字符串的結尾。
• \b：匹配單詞邊界。
• \B：匹配非單詞邊界。

3.4 分組和捕獲

• ()：用于分組和捕獲。捕獲的內容可以通過 exec() 或 match() 方法的返回結果訪問。

const regex = /(\d{4})-(\d{2})-(\d{2})/;
const result = regex.exec('2023-10-05');
console.log(result); // ["2023-10-05", "2023", "10", "05", index: 0, input: "2023-10-05", groups: undefined]

3.5 非捕獲組

• (?:)：用于分組但不捕獲。

const regex = /(?:\d{4})-(?:\d{2})-(?:\d{2})/;
const result = regex.exec('2023-10-05');
console.log(result); // ["2023-10-05", index: 0, input: "2023-10-05", groups: undefined]

4. 正則表達式的標志

• g：全局匹配，查找所有匹配項。
• i：忽略大小寫。
• m：多行匹配，^ 和 $ 匹配每一行的開頭和結尾。

const regex = /hello/gi;
const str = 'Hello world, hello universe';
const result = str.match(regex);
console.log(result); // ["Hello", "hello"]

5. 實際應用示例

5.1 驗證郵箱格式

const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
console.log(emailRegex.test('example@example.com')); // true
console.log(emailRegex.test('invalid-email')); // false

5.2 提取 URL 中的域名

const urlRegex = /https?:\/\/([^\/]+)/;
const url = 'https://www.example.com/path';
const result = urlRegex.exec(url);
console.log(result[1]); // "www.example.com"

5.3 替換字符串中的數字

const str = 'The price is 100 dollars.';
const newStr = str.replace(/\d+/g, 'XXX');
console.log(newStr); // "The price is XXX dollars."

6. 總結

正則表達式是 JavaScript 中處理字符串的強大工具，掌握其基本語法和使用方法可以大大提高開發效率。通過本文的介紹，你應該已經了解了如何創建正則表達式、使用常見的正則表達式方法以及一些常用的模式。在實際開發中，正則表達式可以用于驗證輸入、提取信息、替換文本等多種場景，靈活運用正則表達式將使你的代碼更加簡潔和高效。