通過(guò)正則格式化url查詢字符串實(shí)現(xiàn)代碼
更新時(shí)間：2012年12月28日 18:15:32 作者：
看到項(xiàng)目里通過(guò)js數(shù)組split方法格式化查詢字符串的，突發(fā)奇想為什么不能用正則呢，性能如何?感興趣的朋友可以研究下哦
看到項(xiàng)目里通過(guò)js數(shù)組split方法格式化查詢字符串的，突發(fā)奇想為什么不能用正則呢，性能如何？于是便有了如下代碼：
var url='www.baidu.com?a=123&b=456&c=789&e=dfsdfsdfsdfsdfsdfsdf&f=46545454545454785&g=e23232dsfvdfvdf';
/**
* 格式化查詢字符串(正則實(shí)現(xiàn))
* @param url url地址
* @return {Object} 格式化的json對(duì)象
*/
function formatUrl(url){
var reg=/(?:[?&]+)([^&]+)=([^&]+)/g;
var data={};
function fn(str,pro,value){
data[decodeURIComponent(pro)]=decodeURIComponent(value);
}
url.replace(reg,fn);
return data;
}
/**
* 格式化查詢字符串(數(shù)組實(shí)現(xiàn))
* @param url url地址
* @return {Object} 格式化的json對(duì)象
*/
function formatUrl2(url){
url=url.replace(/.*\?/,'');
var args={},
items=url.length?url.split("&"):[]
,item=null
,i=0
,len=items.length;
for(i=0;i<items.length;i++){
item=items[i].split("=");
args[decodeURIComponent(item[0])]=decodeURIComponent(item[1]);
}
return args;
}
var startTime=new Date();
for(var i=0;i<1000000;i++){
formatUrl2(url);
}
console.log('formatUrl2',(new Date()-startTime)); //formatUrl2 12138
startTime=new Date();
for(var i=0;i<1000000;i++){
formatUrl(url);
}
console.log('formatUrl',(new Date()-startTime)); //formatUrl 12537
測(cè)試瀏覽器是chrme 25；正則實(shí)現(xiàn)的函數(shù)居然比數(shù)組實(shí)現(xiàn)的函數(shù)要慢（淚奔....）。不過(guò)還好，在重復(fù)執(zhí)行一百萬(wàn)次的情況下只慢0.4秒
復(fù)制代碼 代碼如下:
var url='www.baidu.com?a=123&b=456&c=789&e=dfsdfsdfsdfsdfsdfsdf&f=46545454545454785&g=e23232dsfvdfvdf';
/**
* 格式化查詢字符串(正則實(shí)現(xiàn))
* @param url url地址
* @return {Object} 格式化的json對(duì)象
*/
function formatUrl(url){
var reg=/(?:[?&]+)([^&]+)=([^&]+)/g;
var data={};
function fn(str,pro,value){
data[decodeURIComponent(pro)]=decodeURIComponent(value);
}
url.replace(reg,fn);
return data;
}
/**
* 格式化查詢字符串(數(shù)組實(shí)現(xiàn))
* @param url url地址
* @return {Object} 格式化的json對(duì)象
*/
function formatUrl2(url){
url=url.replace(/.*\?/,'');
var args={},
items=url.length?url.split("&"):[]
,item=null
,i=0
,len=items.length;
for(i=0;i<items.length;i++){
item=items[i].split("=");
args[decodeURIComponent(item[0])]=decodeURIComponent(item[1]);
}
return args;
}
var startTime=new Date();
for(var i=0;i<1000000;i++){
formatUrl2(url);
}
console.log('formatUrl2',(new Date()-startTime)); //formatUrl2 12138
startTime=new Date();
for(var i=0;i<1000000;i++){
formatUrl(url);
}
console.log('formatUrl',(new Date()-startTime)); //formatUrl 12537
測(cè)試瀏覽器是chrme 25；正則實(shí)現(xiàn)的函數(shù)居然比數(shù)組實(shí)現(xiàn)的函數(shù)要慢（淚奔....）。不過(guò)還好，在重復(fù)執(zhí)行一百萬(wàn)次的情況下只慢0.4秒
您可能感興趣的文章:
- asp.net獲取URL和IP地址的方法匯總
- ASP.NET中的URL過(guò)濾實(shí)現(xiàn)代碼
- js中escape對(duì)應(yīng)的C#解碼函數(shù) UrlDecode
- js分解url參數(shù)（面向?qū)ο?極簡(jiǎn)主義法應(yīng)用）
- Asp.net中Request.Url的各個(gè)屬性對(duì)應(yīng)的意義介紹
- js URL參數(shù)的拼接方法比較
- ASP.NET jQuery 實(shí)例10 動(dòng)態(tài)修改hyperlink的URL值
- 從URL中提取參數(shù)與將對(duì)象轉(zhuǎn)換為URL查詢參數(shù)的實(shí)現(xiàn)代碼
- 關(guān)于URL中的特殊符號(hào)使用介紹
- js中將URL中的參數(shù)提取出來(lái)作為對(duì)象的實(shí)現(xiàn)代碼
- URL中去除指定參數(shù)實(shí)現(xiàn)C#代碼
相關(guān)文章
Javascript模擬實(shí)現(xiàn)new原理解析
這篇文章主要介紹了Javascript模擬實(shí)現(xiàn)new原理解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-03-03
動(dòng)態(tài)顯示可輸入的字?jǐn)?shù)提示還可以輸入的字?jǐn)?shù)
這篇文章主要介紹了動(dòng)態(tài)顯示可輸入的字?jǐn)?shù)提示還可以輸入的字?jǐn)?shù),需要的朋友可以參考下2014-04-04
10行代碼實(shí)現(xiàn)微信小程序滑動(dòng)tab切換
這篇文章主要為大家詳細(xì)介紹了10行代碼實(shí)現(xiàn)微信小程序滑動(dòng)tab切換效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-12-12
js驗(yàn)證框架之RealyEasy驗(yàn)證詳解
這篇文章主要為大家詳細(xì)介紹了js驗(yàn)證框架之RealyEasy驗(yàn)證，記錄了RealyEasy驗(yàn)證的使用步驟，感興趣的小伙伴們可以參考一下2016-06-06
JS頁(yè)面刷新與重新加載功能實(shí)現(xiàn)(關(guān)閉當(dāng)前窗口)
在計(jì)算機(jī)網(wǎng)頁(yè)中如果我們想獲取當(dāng)前頁(yè)面最新的內(nèi)容,可以刷新當(dāng)前頁(yè)面重新獲取數(shù)據(jù),這篇文章主要給大家介紹了關(guān)于JS頁(yè)面刷新與重新加載功能實(shí)現(xiàn)(關(guān)閉當(dāng)前窗口)的相關(guān)資料,需要的朋友可以參考下2023-10-10
js二級(jí)地域選擇的實(shí)現(xiàn)方法，需要的朋友可以參考一下2013-06-06
ES6學(xué)習(xí)教程之Map的常用方法總結(jié)
Map 是 ES6 中新增的一種數(shù)據(jù)結(jié)構(gòu)，與 Set 一起添加，其實(shí)功能都差不多。下面這篇文章主要給大家總結(jié)介紹了關(guān)于ES6學(xué)習(xí)教程之Map的常用方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面來(lái)一起看看吧。2017-08-08
JS實(shí)現(xiàn)合并兩個(gè)數(shù)組并去除重復(fù)項(xiàng)只留一個(gè)的方法
這篇文章主要介紹了JS實(shí)現(xiàn)合并兩個(gè)數(shù)組并去除重復(fù)項(xiàng)只留一個(gè)的方法,涉及JavaScript數(shù)組合并及去重的相關(guān)技巧,需要的朋友可以參考下2015-12-12
JavaScript初學(xué)者應(yīng)注意的七個(gè)細(xì)節(jié)小結(jié)
每種語(yǔ)言都有它特別的地方，對(duì)于JavaScript來(lái)說(shuō)，使用var就可以聲明任意類型的變量，這門腳本語(yǔ)言看起來(lái)很簡(jiǎn)單，然而想要寫出優(yōu)雅的代碼卻是需要不斷積累經(jīng)驗(yàn)的2012-01-01
這篇文章主要介紹了Webpack優(yōu)化-縮小文件搜索范圍的相關(guān)知識(shí)，文中較詳細(xì)的給大家介紹了可以優(yōu)化的途徑,需要的朋友可以參考下2017-12-12