JavaScript 正则表达式方法与字符串处理详解-优快云博客

JavaScript 正则表达式方法与字符串处理详解

ko.javascript.info 모던 JavaScript 튜토리얼(The Modern JavaScript Tutorial in Korean ) 项目地址: https://gitcode.com/gh_mirrors/ko/ko.javascript.info

正则表达式是 JavaScript 中强大的文本处理工具，本文将深入探讨 JavaScript 中与正则表达式相关的各种字符串方法，帮助开发者掌握高效处理文本的技巧。

字符串匹配方法

str.match(regexp) 方法

str.match(regexp) 方法用于在字符串中查找正则表达式的匹配项，其行为取决于正则表达式是否包含全局标志 g：

无全局标志时返回第一个匹配项的详细信息数组：
- 数组元素包含完整匹配和捕获组
- 包含 index（匹配位置）和 input（原始字符串）属性

let str = "I love JavaScript";
let result = str.match(/Java(Script)/);
// result[0] 包含完整匹配 "JavaScript"
// result[1] 包含第一个捕获组 "Script"
// result.index 包含匹配位置 0

有全局标志时返回所有匹配项的字符串数组（不包含详细信息）

let str = "I love JavaScript";
let result = str.match(/Java(Script)/g);
// 返回 ["JavaScript"]

无匹配项时返回 null（注意不是空数组）

str.matchAll(regexp) 方法（ES2020新增）

matchAll 是 match 方法的增强版，专门用于获取所有匹配项及其捕获组：

返回可迭代对象（可通过 Array.from 转为数组）
每个匹配项都包含完整信息（类似无 g 标志的 match）
无匹配时返回空可迭代对象（非 null）

let str = '<h1>Hello, world!</h1>';
let matches = Array.from(str.matchAll(/<(.*?)>/g));
// 获取所有标签及其内容

字符串分割与搜索

str.split(regexp|substr, limit)

使用正则表达式或子字符串作为分隔符拆分字符串：

// 使用字符串分隔符
'12-34-56'.split('-'); // [12, 34, 56]

// 使用正则表达式处理复杂分隔符
'12, 34, 56'.split(/,\s*/); // [12, 34, 56]

str.search(regexp)

查找第一个匹配项的位置（类似 indexOf 但支持正则表达式）：

"A drop of ink".search(/ink/i); // 10

注意：search 只能找到第一个匹配项的位置。

字符串替换方法

str.replace(str|regexp, str|func)

功能强大的搜索替换方法，支持字符串和函数替换：

简单字符串替换（仅替换第一个匹配项）：
```
'12-34-56'.replace("-", ":"); // "12:34-56"
```
全局正则替换（替换所有匹配项）：
```
'12-34-56'.replace(/-/g, ":"); // "12:34:56"
```

特殊替换模式：

// 交换名字和姓氏
"John Smith".replace(/(\w+) (\w+)/, '$2, $1'); // "Smith, John"

函数替换（实现复杂逻辑）：

// 将所有匹配项转为大写
"html and css".replace(/html|css/gi, str => str.toUpperCase());

正则表达式对象方法

regexp.exec(str)

正则表达式对象的执行方法，特别适合在循环中获取所有匹配项：

let str = 'More about JavaScript';
let regexp = /javascript/ig;
let result;

while (result = regexp.exec(str)) {
  console.log(`Found ${result[0]} at ${result.index}`);
}

特点：

通过 lastIndex 属性跟踪搜索位置
可手动设置 lastIndex 从指定位置开始搜索

regexp.test(str)

快速测试字符串是否包含匹配项，返回布尔值：

/I love/i.test("I love JavaScript"); // true

注意：全局正则表达式的 test 方法会更新 lastIndex，可能导致意外结果。

最佳实践与注意事项

处理无匹配情况：match 返回 null 而非空数组，使用 || [] 避免错误
```
let result = str.match(regexp) || [];
```
现代方法优先：matchAll 比循环 exec 更简洁
全局正则表达式复用：复用全局正则时注意重置 lastIndex
性能考虑：简单搜索使用 includes/indexOf 比正则更快