jQuery中使用了大量的正則表達式吁伺,這些正則匯聚了作者的智慧,值得細心琢磨.
url 分割
下面這個正則用來解析url,使用它可以獲取url中的各個部分(protocol,host,port)
rurl = /^([\w.+-]+:)(?:\/\/([ ^\/?#:]*)(?::(\d+)|)|)/
涉及的知識點:
^匹配一個輸入或一行的開頭, 例如/^a/匹配"an" 不匹配"An",如果設(shè)置了Multiline屬性婆硬,也匹配“\n”或“\r”之后的位置.出現(xiàn)在中括號時躺枕,匹配未包含其之后的任意字符,例如[^xyz]表示不匹配xyz
?分組分為捕獲性分組和非捕獲性分組氓栈,捕獲分組會存儲匹配的內(nèi)容渣磷,以便下次使用,非捕獲性分組不存儲匹配的內(nèi)容授瘦,以(?:...)表示
[\w.+-]protocol包含字母數(shù)字醋界,.+-這幾類字符竟宋,并且是以字母開頭,參考URI .+都是特殊字符形纺,為什么不轉(zhuǎn)義呢丘侠?[\w.+-]奇怪的是chrome下面測試[\w.+-]和[\w.+-]是等價的??
|選擇符逐样,rurl中選擇符的使用有點奇怪蜗字,/x|/的意思是匹配x或者空字符串/(x)|()/.exec('a') -> ["",undefined, ""];
跨域
很多文章都在講跨域,到底什么是跨域呢脂新,看看ajax中是如何判斷跨域的
if ( s.crossDomain == null ) {
parts = rurl.exec( s.url.toLowerCase() ); //使用rurl切割用戶請求的
urls.crossDomain = !!( parts && //ajaxLocParts是當(dāng)前頁面的
( parts[ 1 ] !== ajaxLocParts[ 1 ] || parts[ 2 ] !== ajaxLocParts[ 2 ] ||
( parts[ 3 ] || ( parts[ 1 ] === "http:" ? "80" : "443" ) ) !==
( ajaxLocParts[ 3 ] || ( ajaxLocParts[ 1 ] === "http:" ? "80" : "443" ) ) )
);
}
- 協(xié)議不同
- 域名不同
- 端口不同
請求加時間戳挪捕,禁止瀏覽器緩存
function addDateStamp( url ){
var rts = /([?&])_=[ ^&]*/
return rts.test( url) ?
// If there is already a '_' parameter, set its value
url.replace( rts, "$1_=" + new Date().getTime() ) : // Otherwise add one to the end
url + ( /\?/.test( url ) ? "&" : "?" ) + "_=" + new Date().getTime();
}
/%20/
jquery工具函數(shù)$.param用于對象序化
例如$.param({a : ' '}) -> a=+, 為什么結(jié)果是a=+而不是a=空格?
因為$.param方法內(nèi)部使用encodeURIComponent對字符進行編碼戏羽,空格經(jīng)過編碼是%20,然后使用str.replace( /%20/g , "+" )替換%20.
為什么要將空格變?yōu)榧犹柲兀?/strong>
w3c中關(guān)于 Form content types中要求瀏覽器必須實現(xiàn) application/x-www-form-urlencoded 和 multipart/form-data編碼規(guī)范担神,二前者明確規(guī)定 Space characters are replaced by `+'
下面是一些網(wǎng)絡(luò)參考:
一個題外話,我們知道http response有一個contentType響應(yīng)頭始花,http request 也可以設(shè)置contentType妄讯,你知道嗎?有什么作用呢酷宵?
response header的contentType是告訴瀏覽器亥贸,服務(wù)器回傳的數(shù)據(jù)是什么類型,瀏覽器要如何處理浇垦。
request header 的contentType自然就是告訴服務(wù)器炕置,瀏覽器傳給你的時什么數(shù)據(jù),你應(yīng)該如何去解碼處理等等男韧。
jquery 中ajax也是會默認設(shè)置request 的contentType header朴摊,
1.7.2版本之前的值是application/x-www-form-urlencoded,之后的版本加上了charset=UTF-8此虑。
對于使用ajax傳遞中文的情況甚纲,在使用1.7.2之前的版本會出現(xiàn)中文亂碼的情況。處理的方案也很簡單朦前,就是覆蓋原先的contentType介杆,使用contentType=application/x-www-form-urlencoded;charset=UTF-8。
替換函數(shù)參數(shù)問題
str.replace(ExpReg , replacementFn )
替換函數(shù)的第一個參數(shù)代表的是正則的匹配結(jié)果韭寸,之后的參數(shù)對應(yīng)的是正則中的分組春哨,_1 代表的就是第一個分組(a)的匹配結(jié)果。
var regExp = /(a)(b)(c)/;
function replacement( _, _1, _2, _3 ){
return _3 + _2 + _1 ;
}
console.log('abc'.replace(regExp,replacement)); // output: cba
idGetByProgram.replace( /'|\/g , "\$&" )
Sizzle函數(shù)中有一處代碼恩伺,將兩個特殊字符('和)添加轉(zhuǎn)義字符\赴背,為什么要做這個事情呢?
$&的值指的是正則第一個參數(shù)匹配到的結(jié)果
去除首尾空格
sizzle中有一個去除首尾空格的正則
rtrim = /^[\x20\t\r\n\f]+|((?:^|[ ^\\])(?:\\.)*)[\x20\t\r\n\f]+$/g
((?:|[\])(?:\.)*)東東是用來干什么的,是有什么特殊情況需要考慮嗎癞尚?
下面的耸三,也能夠去掉首尾空格,
/^\s+|\s+$/g
jquery本身也定義了一個去除空格的正則浇揩,名字也叫rtrim仪壮,但是兩個正則寫法不同為什么呢?
rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/