正则
起首看一下个中的正则表达:
fragmentRE = /^\s*<(\w+|!)[^>]*>/,
singleTagRE = /^<(\w+)\s*\/?>(?:<\/\1>|)$/,
tagExpanderRE = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/ig,
rootNodeRE = /^(?:body|html)$/i,
capitalRE = /([A-Z])/g,
JavaScript的正则表达式要包含在/ /
中心。背面能够跟g
,i
来示意是不是举行全局婚配或许不辨别大小写婚配。
fragmentRE = /^\s*<(\w+|!)[^>]*>/
-
^
从句首最先婚配 -
\s
是一个metacharacter
,婚配一个空缺字符,包含space, tab, carriage return。 背面随着*
,示意能够婚配0个或0个以上空缺字符 -
<
婚配一个<
-
(\w+|!)
,\w
是一个metacharacter
, 婚配0-9a-zA-Z_
, 注重个中包含下划线.\w+
示意婚配一个或许一个以上该字符.|
示意或许.!
婚配!
. 括号的作用是用于捕捉(capture), 在婚配文本时,能够输出相对应的字符(characters). -
[^>]
^
在句首示意从最先婚配, 在[]
这个class中示意 非 的意义, 而且[]
只能示意一个字符。 所以这个表达式的意义是 婚配一个不是>
的字符.背面随着*
,示意婚配0个或许0个以上不是>
的字符 -
>
婚配一个>
.
singleTagRE = /^<(\w+)\s*\/?>(?:<\/\1>|)$/
-
^
婚配句首 -
<
婚配<
-
(\w+)
婚配一个或许多个0-9a-zA-Z_
的字符, 而且catpure. -
\s*
婚配0个或0个以上空缺字符 -
\/?
婚配0个或1个/
, 个中\
为escape -
>
婚配>
-
(?:<\/\1|)
,?:
示意不capture, 我用这个括号就是想为了把他圈起来. 背面的\1
是一块的,示意把第一个捕捉的内容插进去到这来,在这个例子中也就是\w+
所以,它完全能够写成(?:>\/\w+|)
.|
示意或许,它背面什么都没有,那末这个表达式的意义就是要么婚配\/\w+
要么啥也不必婚配. -
$
婚配句尾,假如要婚配的文本超出了前面能够婚配的长度,那这个文本团体就不婚配该表达式
所以这个表达式能够婚配<br>
, <br />
, <h3></h3>
. 末了一种状况只捕捉<h3>
tagExpanderRE = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/ig,
-
(?!exp)
零宽度负展望先行断言(zero-width negative lookahead assertion), 婚配背面跟的不是exp的位置. 比方\d{3}(?!\d)
婚配三位数字,而且这三位数字背面不能是数字.
同理这个表达式婚配<
, 然则<
背面不能跟area, br 等等. -
(([\w:]+)[^>]*)
作为一个团体来看是一个caputring group. 然后内里有一个小的capturing group 2, 能够婚配\w
或许:
而且能够反复1到无限次. 背面能够随着不是>
的恣意次字符 -
\/>
婚配/>
所以这个表达式能够婚配<abc:sfsf/> 之类的文本,然则不能婚配<img/>
rootNodeRE = /^(?:body|html)$/i,
这个应当没什么好诠释的的了,要么婚配body
,要么婚配html
,不辨别大小写
capitalRE = /([A-Z])/g,
婚配大写字母
通读源码
isArray = Array.isArray ||
function(object){ return object instanceof Array }
用于推断对象是不是是array, MDN的引荐做法是
if (!Array.isArray) {
Array.isArray = function(arg) {
return Object.prototype.toString.call(arg) === '[object Array]';
};
}
这内里运用Object.prototype.toString()
来推断参数的范例
总结
用toString
来detect object class. 注重isArray
的polyfill.