js 正则表达式用变量连续使用的问题

在js中我们可能会遇到连续用同一个正则校验的情况，这里以校验邮箱为例
先来一段邮箱的正则

const emailReg = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/g;

然后我们先来一个邮箱校验

emailReg.test("1111111111@qq.com");
// => true

这么一看确实没问题，但是如果是多个邮箱呢

const emailReg = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/g;
console.log(emailReg.test("1111111111@qq.com"));
console.log(emailReg.test("1111111111@qq.com"));
console.log(emailReg.test("1111111111@qq.com"));
console.log(emailReg.test("1111111111@qq.com"));
console.log(emailReg.test("1111111111@qq.com"));

会发现结果和预期不太一样了

image.png

原因

这是因为正则表达式如果用变量的方式证明的话，连续使用时，他会从上一次匹配到的位置继续开始，并不是从第0个位置开始匹配的，匹配不到时会返回false，索引位置重新归0，所以第二次找不到，第三次又找到了

第一次 test("1111111111@qq.com")：匹配成功，返回 true
第二次 test("1111111111@qq.com")：因为位置已经移动，无法匹配，所以返回 false
第三次 test("1111111111@qq.com")：又回到字符串开始，匹配成功，返回 true
第四次 test("1111111111@qq.com")：位置再次移动，无法匹配，返回 false
第五次 test("1111111111@qq.com")：又回到字符串开始，匹配成功，返回 true