JavaScript 正则如何提取

打开手机相册翻照片时，你会不会下意识找那几张带具体时间的截图？比如“2024-05-12 周末聚餐记录”，里面藏着你想找的信息。如果这些文字是存在一段字符串里的，比如一段聊天记录、一篇笔记的文本，怎么快速把里面的日期、手机号或者邮箱摘出来？这时候，JavaScript里的正则表达式就能帮上忙。

很多人觉得正则像一串乱码，其实它只是给电脑“划重点”的规则，就像你给朋友发的“帮我找这段文字里带横线的日期”的指令。咱们从最常用的场景入手，一步步拆解怎么用它提取信息，全是生活化的例子，不用记复杂术语。

先搞懂核心：正则提取的两个关键步骤

不管要提取什么，都得先做两步：第一步告诉电脑“要找的内容是什么样的”，第二步告诉电脑“找到后要把它拿出来”。举个最常见的例子：你要从一段文字里提取所有11位的中国手机号，手机号的特征是“开头是1，第二位是3/4/5/6/7/8/9，后面跟9个数字”，把这个特征写成正则，再用JavaScript的方法把匹配到的内容拿出来就行。

第一个场景：提取固定格式的文本（比如日期）

先看一段很实用的文本：“今天是2024-06-15，昨天是2024-06-14，前天是2024-06-13，我们约了2024-07-01去旅行”。这里的日期都是“YYYY-MM-DD”的格式，要把所有日期摘出来，怎么写正则？

这个日期的特征很明确：4个数字+横线+2个数字+横线+2个数字，对应正则里的\d{4}-\d{2}-\d{2}。这里的\d代表“任意数字”，{4}代表“前面的内容要重复4次”，横线是固定要匹配的符号。

然后用JavaScript的match方法就能拿到结果：

`javascript

const text = "今天是2024-06-15，昨天是2024-06-14，前天是2024-06-13，我们约了2024-07-01去旅行";

const dateList = text.match(/\d{4}-\d{2}-\d{2}/g);

`

这里的g是全局匹配的意思，就是把所有符合的都找出来，不然只会返回第一个。运行后dateList就是["2024-06-15", "2024-06-14", "2024-06-13", "2024-07-01"]，刚好是需要的所有日期。

第二个场景：提取位置灵活的信息（比如用户名）

如果信息的格式不固定，比如一段评论里的“@小明 你发的文件，@小红 麻烦帮我看看”，要把所有@后面的用户名摘出来，用户名的特征是“@开头，后面跟至少1个非空格的字符（因为用户名不会有空格）”，对应的正则是/@(\S+)/，这里的\S代表“非空格的任意字符”，括号是把要提取的内容单独分组。

用matchAll方法可以拿到所有分组的内容：

`javascript

const comment = "@小明 你发的文件，@小红 麻烦帮我看看";

const userList = Array.from(comment.matchAll(/@(\S+)/g), match => match[1]);

`

运行后userList就是["小明", "小红"]，完美避开了@符号，只拿到了需要的用户名。

避坑提醒：别漏了全局匹配的标记

很多新手会犯一个错：写了正则，用match只拿到第一个结果，就以为正则写得不对，其实是忘了加g标记。比如刚才的日期例子，没加g的话，dateList只会是["2024-06-15"]，白忙活一场。如果是要提取带分组的内容，用matchAll的时候，也要记得加g，不然只能拿到第一次的匹配结果。

其实JavaScript正则提取的本质，就是把生活里的“找XX样子的内容”转换成电脑能看懂的规则，再用内置方法把匹配到的内容取出来。平时不用硬背复杂的正则，遇到具体场景的时候，先想清楚要提取的内容有什么固定特征，再对应写出简单的规则就行。