这篇文章给大家介绍在JavaScript中使用pattern时需要注意哪些事项，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。
创新互联建站-专业网站定制、快速模板网站建设、高性价比高台网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式高台网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖高台地区。费用合理售后完善，10余年实体公司更值得信赖。
RegExp对象的创建：
常规的正则表达式的创建可用直接量，即斜杠 “/” 括起来的字符。但在要求参数变化的环境下，RegExp()构造函数是更好的选择：
var reg1 = /'\w+'/g;
var reg2 = new RegExp('\'\\w+\'','g');对比两种创建方式，RegExp中的第一个参数为要创建的正则字符串，一方面注意，因为不是直接量的表示形式，因此不用斜杠“ / ”括起来了；而是字符串中必须要对引号“ ‘ ”和转义符号“ \ ”进行二次转义。
此外，无论是直接量还是RegExp()构造函数，都是生成了新的RegExp对象，并将其赋值给变量。
在《Javascript权威指南》一书中讲到，对于正则表达式的直接量，ECMAscript 3规定在每次它时都会返回同一个RegExp对象，因此用直接量创建的正则表达式的会共享一个实例。直到ECMAScript 5才规定每次返回不同的实例。
各浏览器中，IE一直遵守ECMAScript 5中的规定，其他浏览器的较老版本则遵循ECMAScript 3的规定。因此在实际应用中，采取构造函数创建的方法比较安全，或者在使用lastIndex属性时要记得归0。
括号()的使用：
1、分组
即把单独项组合成子表达式统一处理，一般用于？、+、*、{n,m}等的重复处理。见例子：
var reg = /Java(script)?/;
式子里将script进行统一处理。
2、向后引用
即在正则表达式中用“\n”（n代表引用的序号）引用式中前面括号中匹配的文本。见例子：
var reg = /(\d+)[a-z]{3}\1/;
//20man20
//20man23 错
//reg = /\1[a-z]{3}(\d+)/; 错注意 “\n”引用的是前面匹配的文本" 20 "，而不是匹配的正则表达式" \d+ "。另外，JS里只能引用前面的匹配文本，像例子中的将 \1写在括号引用的前面，将不会匹配到任何文本，浏览器中会提示出错。同样，JS里也不支持类似“ (?
既然提到了分组和引用，如果只想进行分组，而不想引用，则可用 "(?: exp)"的形式，既不匹配文本，也不给引用编号。见例子：
var reg = /(\w{3})(?:\d+)([a-z]{2})\2/;
//man7788abab显然 \2 匹配的是 "ab" 而不是 "7788" 。这样便于分组处理，也加快了查询的效率。
3、子模式匹配
有时我们想直接引用操作括号匹配的本文，那么可以用子模式匹配的功能（权威指南里叫子模式匹配，有点别扭，实际就是用一个变量形式替换匹配的文本）。基本形式是用 '$n'的形式替代匹配编号为n的文本，常用在String对象里的replace()方法，见例子，等号两边交换单词：
var reg = /(\w+)=(\w+)/; var str = ‘love=hate'; str.replace(reg,'$2=$1'); //"hate=love"
次序、贪婪、懒惰：
一般的重复匹配字符如？、+、*、{n,m}在匹配的过程中，采用贪婪匹配的方法，即尽可能多的匹配到结果字符。与之对应的是懒惰匹配，即尽可能少的匹配结果，使用形式只需在重复匹配字符后加上问号" ？ "即可，如？？、+？、*？、{n,m}？。见例子：
var str = 'goooogle‘; var reg1 = /o+/; //"goooo" var reg2 = /o+?/; //"go"
现在对例子稍加改动：
var str = 'goooogle‘; var reg1 = /o+gle/; //"oooogle" var reg2 = /o+?gle/; //"oooogle"
改过后的例子结果变为相同了，为什么 /o+?gle/ 没有匹配到“ogle”呢？原来正则表达式中总是从左往右进行匹配的，不会从右边获取子串进行匹配。
虽然上面的结果相同，但匹配的原理不太一样。在reg1中，首先o+会匹配所有的"o"，然后接着匹配"gle"，从而完成整体匹配。而在reg2中，o+?会先匹配一个"o"，然后gle在字符串的第2位到第4位（即原串的"ooo"）匹配失败。进而回溯至o+?去匹配第二个"o"，成功后再在第3位到第4位匹配"gle"，以此类推……最后匹配到整个字符串。
总体要记住，从优先级来说，从左往右的次序匹配 > 贪婪 / 懒惰匹配。
零宽断言：
关于零宽断言的总体解释可参考博文《正则表达式30分钟入门教程》，值得注意的是，JS里只支持零宽先行断言。即零宽正预测先行断言"(?=exp)"和零宽负预测先行断言“(?!exp)"。
所谓“零宽”，就是它并不在匹配的结果字符中占据空间。例如“\w"，"\s"就会占据一个或几个空间，依匹配的字符长度决定。而像”^"，"$"这种对应的首末位置，不占据空间，零宽就是属于这一类。
所谓“正 / 负预测”，是指断言中要求满足的情况。“正”表示要满足exp，“负”表示要不满足exp的。
所谓"先行"，是指被匹配的字符串在前面，零宽断言跟在后面。即串的后一部分是否满足断言。
所谓“断言”，就是判断的条件。
看两种零宽断言的例子：
var str = 'java coffeescript'; var reg1 = /\b\w+(?=script\b)/; //coffee var reg2 = /\b\w+(?!script\b)/; //java
reg1为零宽正预测先行断言，"(?=script\b)"表示某单词需以“script”结尾，它代表着一种条件，不占有任何空间大小。
同样，reg2为零宽负预测先行断言，"(?!script\b)"表示不以“script”结尾的单词。
另外，因为没有零宽后顾断言，不能判断某字符串的前面部分满足什么条件。但在JS中可以用多次正则表达式来实现：先匹配到要找的串，然后截取开头到index的字符子串，再匹配子串末尾是否符合需要的断言条件。具体用法可另外尝试一下。
match()与exec()的异同：
match和exec是正则表达式匹配字符串的常用方法。两者实现的功能差不多，有些细微的区别：
1、使用方式
match是字符串包装对象的方法，用法：String.match(RegExp);
exec是正则表达式对象的方法，用法：RegExp.exec(String);
2、返回的结果
当RegExp没有设置全局标志 "g" 时：
两者的返回结果相同。即无匹配值时返回null，有匹配值时返回一个数组（令array）。array[0]为匹配的字符串，array[1]、array[2]……则对应为正则表达式中圆括号匹配的子字符串$1、$2……。同时数组带有两个属性，array.index表示匹配字符串的初始位置，array.input表示正在检索的字符串。
当RegExp有设置全局标志 "g" 时：
match在有值时返回一个数组array。数组的每项依次表示匹配到的所有的字符串，因此不再有圆括号匹配的子字符串了。此时数组没有index属性和input属性。
exec则与没有全局标示 "g" 的表现无异。此时返回的是数组array，array[0]为当前匹配的字符串，array[1]，array[2]……则为当前匹配下的圆括号匹配的字串。此时要注意RegExp对象的lastIndex属性，表示原字符串中匹配的字符串末尾的后一个位置。当没有进一步的匹配结果时，lastIndex属性置0。因此，可用lastIndex的循环找出所有的匹配字符串。来看看例子：
var str = 'I love1 my job22'; var reg = /\b[a-z]+(\d+)\b/g; array = str.match(reg); //array = ["love1", "job22"] //array.index = undefind //array.input = undefined ------------------------------------ array = reg.exec(str); //array = ["love1", "1"] //array.index = 2 //array.input = "I love1 my job22" //reg.lastIndex = 7 //run again reg.exec(str); //array = ["job22", "22"] //array.index = 11 //array.input = "I love1 my job22" //reg.lastIndex = 16 //run again reg.exec(str); //reg.lastIndex = 0
最后，考虑到ECMAScript 3 和ECMAScript 5的版本区别，每次匹配完之后记得要手动将RegExp对象的lastIndex属性置0，以满足老非IE浏览器的要求。
js正则表达式，pattern，注意事项
一句话，请使用，/\w+@+\w+(\.+\w+){1,}/.test(str) 来验证，不要用"\w+@+\w+(\.+\w+){1,}".test(str) 来验证；
使用后者，直接，用add@dfddf 就可以通过验证了；
关于在JavaScript中使用pattern时需要注意哪些事项就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。