JavaScript 正则表达式入门:从“看不懂的斜杠怪”到模式匹配利器

1次阅读

JavaScript 正则表达式入门:从“看不懂的斜杠怪”到模式匹配利器

本文专为初学者解析 javaScript 中看似混乱实则强大的正则表达式regexp)——那些出现在两个斜杠 /…/ 之间的“乱码”,其实是声明正则字面量的标准语法,用于高效匹配、提取和替换字符串中的特定模式。

本文专为初学者解析 javascript 中看似混乱实则强大的正则表达式(regexp)——那些出现在两个斜杠 `/…/` 之间的“乱码”,其实是声明正则字面量的标准语法,用于高效匹配、提取和替换字符串中的特定模式。

你刚接触 javascript,在 Codewars 上看到类似 /|/?|/[asd]d++ 这样的代码,第一反应是:“这根本不是函数,也不是对象,连括号都没有……是 bug 吗?”——别担心,这不是垃圾代码,也不是语法错误,而是 正则表达式(Regular Expression,简称 RegExp)的字面量写法

在 JavaScript 中,正则表达式可直接用一对斜杠包裹来创建,例如:

const pattern = /abc/; const emailRegex = /^[^s@]+@[^s@]+.[^s@]+$/;

✅ 斜杠 / 是正则字面量的定界符(类似字符串用引号),中间的内容才是真正的匹配规则。
⚠️ 注意:斜杠 / 在正则内部若需作为普通字符出现(如匹配 URL 中的 /),必须用反斜杠转义:/ —— 这正是你看到 |/?| 中 / 的由来(匹配一个字面量 /)。

来看你遇到的例子:/|/?|/[asd]d++
我们逐步拆解(注意:该表达式本身存在语法问题,仅作教学分析):

  • | 在正则中表示“或”逻辑(需在分组中使用才安全,单独出现易出错);
  • / 匹配一个 / 字符;
  • ? 匹配一个 ? 字符(? 是特殊元字符,必须转义);
  • |/ 可能意图为“匹配 | 或 /”,但缺少左操作数,实际会报错;
  • [asd] 是字符类,匹配单个 a、s 或 d;
  • d++ 是非法写法 —— + 是量词,++ 属于重复量词,JavaScript 正则不支持(会抛出 Invalid regular expression: Nothing to repeat 错误)。

? 正确写法示例(匹配类似 a++、s++、d++ 的模式):

const validPattern = /[asd]++/; // 注意:+ 需转义为 + console.log("d++".match(validPattern)); // ["d++"]

? 关键注意事项:

立即学习Java免费学习笔记(深入)”;

  • 正则字面量 /…/ 后可接标志(flags),如 g(全局)、i(忽略大小写)、m(多行):/hello/gi;
  • 若需动态构建正则(如拼接变量),请使用 RegExp 构造函数:new RegExp(d{${n}}, ‘g’);
  • 初学建议优先掌握基础元字符:.(任意字符)、d(数字)、w(单词字符)、^/$(行首/行尾)、*/+/?(量词)、[](字符类)、()(捕获分组);
  • 复杂正则务必在 regexr.comregex101.com 实时调试——它们提供逐级高亮、匹配说明和错误提示,是学习正则的必备工具。

总结:正则不是“Gibberish”,而是一套紧凑、强大且被广泛支持的文本处理语言。它的确有学习曲线,但一旦掌握,你将获得远超 indexOf 和 split 的字符串操控能力。从今天起,把 /…/ 当作一个“模式容器”,而不是“乱码”,并坚持用工具验证每一个表达式——清晰与掌控,就在下一次成功匹配之中。

text=ZqhQzanResources