jQuery中有一个大量用到的正则表达式rquickExpr
const rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/
可以文字化为
const rquickExpr = /^(?:#(id选择器名称)|(标签选择器名称)|\.(类选择器名称)$/
其作用是来匹配一些简单的id选择器、标签选择器、类选择器，如：#id、div、.class。
那具体是怎么区分哪些是id选择器，哪些是标签选择器，哪些是类选择器呢？
const rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/;
var match = selector.match(reg); //selector为传入的选择器
if(match[1]){
//ID选择器
}else if(match[2]){
//标签选择器
}else if(match[3]){
//类选择器
}
注：jQuery源码中用的是exec()方法，exec()和match()的区别是：无论是否为全局模式，exec() 都会把完整的细节添加到它返回的数组中。故这里用match代替exec也可以
为什么可以用上面简单的代码就可以区分呢？我们可以看一下当selector分别为#id、div、.class的匹配输出信息
image.png
match分析
- 在全局模式下，match的返回值为匹配到的所有元素组成的数组，如：
"ab".match(/a/g) //输出['a']
- 在非全局模式下，match的返回值为匹配到的元素详细
"ab".match(/a|c/) //输出["a", index: 0, input: "ab", groups: undefined]
返回值["a", index: 0, input: "ab", groups: undefined]解释：
"a"：与正则表达式相匹配的文本
如果有组的话，这里还会有与 RegExpObject 的第 1~n 个子表达式相匹配的文本（见后）
index: 0：匹配文本的第一个字符的位置
input: "ab"：被检索的字符串
groups: undefined：存储命名捕获组的信息
groups：存储命名捕获组的信息
// 命名捕获组的获取 let reg1 = /(?<first>\d)(?<second>\d)/ let str2 = '123' console.log(reg2.exec(str2).groups) // => { first: 1, second: 2 } 新的语法支持对这些捕获组进行命名，更方便地获>取某个捕获组的数据
匹配多个组时
var match = "ac".match(/(a)|(b)/)
//输出["a", "a", undefined, index: 0, input: "ac", groups: undefined]
var match = "bc".match(/(a)|(b)/)
//输出["b", undefined, "b", index: 0, input: "bc", groups: undefined]
上面输出数组里的第二个，第三个元素是"a"， undefined，与(a)匹配的文本返回的是"a"，与(b)匹配的文本返回的是undefined（与 RegExpObject 的第 1~n 个子表达式相匹配的文本）
此时对于正则表达式/(a)|(b)/，有如下规律：
if(match[1]){
//匹配到了a
}else if(match[2]){
//匹配到了b
}
这就是区分哪些是id选择器，标签选择器，类选择器的原因了
非获取匹配：?:
?:常宇或选择符|搭配，用来匹配类似a(?:b|c) 可以匹配ab或ac，详情见非正则匹配详解
