jQuery->正则

jQuery中使用了大量的正则表达式，这些正则汇聚了作者们的智慧,值得细心琢磨.

1. url分割

这个正则描述的是url，使用它可以获取url中的各个部分(protocol,host,port)

rurl = /^([w.+-]+:)(?://([^/?#:]*)(?::(d+)|)|)/;

涉及的知识点：

• ^ 匹配一个输入或一行的开头, 例如/^a/匹配"an" 不匹配"An"，如果设置了Multiline属性，^也匹配“ ”或“ ”之后的位置.^ 出现在中括号时，匹配未包含其之后的任意字符，例如[^xyz]表示不匹配xyz

• 分组分为捕获性分组和非捕获性分组，捕获分组会存储匹配的内容，以便下次使用，非捕获性分组不存储匹配的内容，以(?:...)表示

• [w.+-] protocol 包含 字母数字，.+-这几类字符，并且是以字母开头，参考URI .+都是特殊字符，为什么不转义呢？[w.+-]奇怪的是chrome下面测试[w.+-]和[w.+-]是等价的？

• | 选择符，rurl中选择符的使用有点奇怪，/x|/ 的意思是匹配x或者空字符串/(x)|()/.exec('a') -> ["", undefined, ""];

 

2. 跨域

很多文章都在讲跨域，到底什么是跨域呢，看看ajax中是如何判断跨域的

if ( s.crossDomain == null ) {
    parts = rurl.exec( s.url.toLowerCase() ); //使用rurl切割用户请求的url
    s.crossDomain = !!( parts &&              //ajaxLocParts是当前页面的location.href;
        ( parts[ 1 ] !== ajaxLocParts[ 1 ] || parts[ 2 ] !== ajaxLocParts[ 2 ] ||
            ( parts[ 3 ] || ( parts[ 1 ] === "http:" ? "80" : "443" ) ) !==
                ( ajaxLocParts[ 3 ] || ( ajaxLocParts[ 1 ] === "http:" ? "80" : "443" ) ) )
    );
}

a. 协议不同 b. 域名不同 c. 端口不同

3 . 请求加时间戳，避免缓存

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();
} 

4. /%20/

jquery工具函数$.param用于对象序化

例如$.param({a : ' '})  -> a=+, 为什么结果是a=+而不是a=空格？因为$.param方法内部使用encodeURIComponent对字符进行编码，空格经过编码是%20,然后使用str.replace( /%20/g , "+" )替换%20.

为什么要将空格变为加号呢？w3c中关于 Form content types中要求浏览器必须实现 application/x-www-form-urlencoded  和 multipart/form-data编码规范，二前者明确规定 Space characters are replaced by `+'  传送门下面是一些网络参考：

阮一峰的关于URL编码 

When to encode space to plus (+) or %20?

Percent-encoding

x-www-form-urlencoded

urlencoded算法

一个题外话，我们知道http response有一个contentType响应头，http request 也可以设置contentType，你知道吗？有什么作用呢？

response header的contentType是告诉浏览器，服务器回传的数据是什么类型，浏览器要如何处理。request header 的contentType自然就是告诉服务器，浏览器传给你的时什么数据，你应该如何去解码处理等等。jquery 中ajax也是会默认设置request 的contentType header，1.7.2版本之前的值是application/x-www-form-urlencoded，之后的版本加上了charset=UTF-8。对于使用ajax传递中文的情况，在使用1.7.2之前的版本会出现中文乱码的情况。处理的方案也很简单，就是覆盖原先的contentType，使用contentType=application/x-www-form-urlencoded;charset=UTF-8。

 

5.替换函数参数问题

str.replace(ExpReg , replacementFn )

替换函数的第一个参数代表的是正则的匹配结果，之后的参数对应的是正则中的分组，_1 代表的就是第一个分组(a)的匹配结果。

var regExp = /(a)(b)(c)/;
function replacement( _, _1, _2, _3 ){
    return _3 + _2 + _1 ;
}
console.log('abc'.replace(regExp,replacement));  // output: cba

 6. idGetByProgram.replace( /'|\/g , "\$&" )

Sizzle函数中有一处代码，将两个特殊字符('和)添加转义字符，为什么要做这个事情呢？

$&的值是第一个参数匹配到的结果

 

7 去除首尾空格

sizzle中有一个去除首尾空格的正则

rtrim = /^[x20	
f]+|((?:^|[^\])(?:\.)*)[x20	
f]+$/g

((?:^|[^\])(?:\.)*)东东是用来干什么的，是有什么特殊情况需要考虑吗？

下面的，也能够去掉首尾空格，

 /^s+|s+$/g

jquery本身也定义了一个去除空格的正则，名字也叫rtrim，但是两个正则写法不同为什么呢？

rtrim = /^[suFEFFxA0]+|[suFEFFxA0]+$/