为何相同正则表达式在HTML pattern与Express后端的校验表现不一致

• 字符串转义冲突：使用new RegExp()构造函数传入字符串参数时，JavaScript 字符串会优先解析转义字符，正则表达式里\w、\.等元字符前缀的反斜杠\会被字符串解析器当成转义符消耗，最终传递给正则引擎的实际内容变成了w、.，完全破坏了原本的正则规则。而HTML的pattern属性中的正则不需要经过JS字符串解析流程，反斜杠会直接被正则引擎识别，因此两端实际生效的校验规则完全不同。
• 变量名语法错误：代码中声明的变量名re-email包含连字符-，JavaScript 会将该写法识别为减法运算，直接抛出语法错误，也会导致后端校验逻辑无法正常运行。

推荐优先使用正则字面量写法，用正斜线/直接包裹正则表达式，不需要经过字符串转义流程，正则规则可以和前端pattern属性完全对齐：

const reEmail = /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,4})+$/
if (!reEmail.test(email)) {
  validation = false
}

如果必须使用new RegExp()构造函数，则需要把正则中所有的反斜杠都写两次，将其转义为字符串中的普通反斜杠，同时修正变量名：

const reEmail = new RegExp("^\\w+([.-]?\\w+)*@\\w+([.-]?\\w+)*(\\.\\w{2,4})+$")
if (!reEmail.test(email)) {
  validation = false
}

内容的提问来源于stack exchange，提问作者JF0001