通过正则格式化url查询字符串实现代码


Posted in Javascript onDecember 28, 2012

看到项目里通过js数组split方法格式化查询字符串的,突发奇想为什么不能用正则呢,性能如何?于是便有了如下代码:

var url='www.baidu.com?a=123&b=456&c=789&e=dfsdfsdfsdfsdfsdfsdf&f=46545454545454785&g=e23232dsfvdfvdf'; 
/** 
* 格式化查询字符串(正则实现) 
* @param url url地址 
* @return {Object} 格式化的json对象 
*/ 
function formatUrl(url){ 
var reg=/(?:[?&]+)([^&]+)=([^&]+)/g; 
var data={}; 
function fn(str,pro,value){ 
data[decodeURIComponent(pro)]=decodeURIComponent(value); 
} 
url.replace(reg,fn); 
return data; 
} 
/** 
* 格式化查询字符串(数组实现) 
* @param url url地址 
* @return {Object} 格式化的json对象 
*/ 
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

测试浏览器是chrme 25;正则实现的函数居然比数组实现的函数要慢(泪奔....)。不过还好,在重复执行一百万次的情况下只慢0.4秒
Javascript 相关文章推荐
js 复制或插入Html的实现方法小结
May 19 Javascript
理解Javascript_14_函数形式参数与arguments
Oct 20 Javascript
javascript attachEvent绑定多个事件执行顺序问题
Oct 20 Javascript
Jquery时间验证和转换工具小例子
Jul 01 Javascript
js计算系统当前日期是星期几的方法
Jul 14 Javascript
RequireJS简易绘图程序开发
Oct 28 Javascript
微信小程序实现图片自适应(支持多图)
Jan 25 Javascript
jQuery制作input提示内容(兼容IE8以上)
Jul 05 jQuery
vue中计算属性(computed)、methods和watched之间的区别
Jul 27 Javascript
vue中实现先请求数据再渲染dom分享
Mar 17 Javascript
JS 封装父页面子页面交互接口的实例代码
Jun 25 Javascript
vue+openlayers绘制省市边界线
Dec 24 Vue.js
Js数组的操作push,pop,shift,unshift等方法详细介绍
Dec 28 #Javascript
载入jQuery库的最佳方法详细说明及实现代码
Dec 28 #Javascript
一个背景云变换js特效 鼠标移动背景云变化
Dec 28 #Javascript
javascript 实现简单的table排序及table操作练习
Dec 28 #Javascript
jQuery 选择器项目实例分析及实现代码
Dec 28 #Javascript
jQuery插件-jRating评分插件源码分析及使用方法
Dec 28 #Javascript
JS声明变量背后的编译原理剖析
Dec 28 #Javascript
You might like
Classes and Objects in PHP5-面向对象编程 [1]
2006/10/09 PHP
探讨:parse url解析URL,返回其组成部分
2013/06/14 PHP
php微信开发之关注事件
2018/06/14 PHP
onclick与listeners的执行先后问题详细解剖
2013/01/07 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等
2014/05/08 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
2014/12/14 Javascript
Ajax清除浏览器js、css、图片缓存的方法
2015/08/06 Javascript
浅谈json取值(对象和数组)
2016/06/24 Javascript
必备的JS调试技巧汇总
2016/07/20 Javascript
初识简单却不失优雅的Vue.js
2016/09/12 Javascript
Ionic+AngularJS实现登录和注册带验证功能
2017/02/09 Javascript
如何用js判断dom是否有存在某class的值
2017/02/13 Javascript
CentOS环境中MySQL修改root密码方法
2018/01/07 Javascript
vue+axios+mock.js环境搭建的方法步骤
2018/08/28 Javascript
vue集成百度UEditor富文本编辑器使用教程
2018/09/21 Javascript
[02:11]DOTA2上海特级锦标赛主赛事第二日RECAP
2016/03/04 DOTA
浅谈Python2获取中文文件名的编码问题
2018/01/09 Python
Python lambda函数基本用法实例分析
2018/03/16 Python
Django 开发环境配置过程详解
2019/07/18 Python
Python 多线程,threading模块,创建子线程的两种方式示例
2019/09/29 Python
Python字典的概念及常见应用实例详解
2019/10/30 Python
Anaconda+Pycharm环境下的PyTorch配置方法
2020/03/13 Python
Python 实现将大图切片成小图,将小图组合成大图的例子
2020/03/14 Python
解决Python 异常TypeError: cannot concatenate 'str' and 'int' objects
2020/04/08 Python
使用phonegap查找联系人的实现方法
2017/03/31 HTML / CSS
印度最大的网上花店:Ferns N Petals(鲜花、礼品和蛋糕)
2017/10/16 全球购物
潘多拉珠宝英国官方网上商店:PANDORA英国
2018/06/12 全球购物
日本酒店、民宿、温泉旅馆、当地旅行团中文预订:e路东瀛
2019/12/09 全球购物
泰国时尚电商:POMELO Fashion
2020/03/11 全球购物
邻里守望志愿服务活动方案
2014/08/15 职场文书
人代会简报
2015/07/21 职场文书
幼儿园体操比赛口号
2015/12/25 职场文书
教师法制教育培训学习心得体会
2016/01/14 职场文书
廉洁自律承诺书2016
2016/03/25 职场文书
关于JavaScript轮播图的实现
2021/11/20 Javascript