querystring 解析url 查询字符串

　　对前端同学来说，经常要碰到一种比较麻烦的情况，那就是url查询字符串的解析问题。说起来也不难，就是比较麻烦。

　　具体来处理这种情况的时候，相信有一部分同学就是针对具体项目中的需要的字符去正则匹配一下，业务需求嘛，解决就算了。原来我也是这样干的。不过最好还是抽一种方法出来，毕竟这种工具类的发放很多地方都会用到。当然现在github上有很多大牛的作品可以借鉴。今天自己也来实现一下。

　　总体思路很简单，就是正则去匹配看是否有查询字符串的出现，不过为了功能丰富点也就是随手加上了支持自定义字符串的解析（有点鸡肋），可选返回的是数组或者对象。具体处理可以见代码：

/**

 * @method queryString

 * @param getObj 结果为对象否则为数组

 * @default false

 * @param str 需要解析的string

 * @default location.search

 * @return Object or Array

 * */

function queryString(getObj,str){

    var string = (str!== undefined) ? str :  window.location.search;

    var result = string.match(new RegExp("[^\?\&]+=[^\?\&]+","g"));

    if(result == null){

        result = '';

    }else if(getObj){

        var params = {};

        for(var i = 0; i < result.length; i++){

            var res = result[i].split('=');

            var key = res[0],

                value = res[1];

            params[key] = value;

        }

        result = params;

    }

    return result;

}

　　2、关于业务方的需求，用一句话来形容比较合适：天长地久有时尽，需求变动无绝期。可能你有时候说，后端tm不需要全部的查询字符串他只要一个或者多个，反正就不要全部的。你给我个对象还是需要处理呀，能不能一步到位暴露获取具体的某个key的值的方法。当然既然都抽出来了那就要有这个意识。

　　还是先说实现，其实与上面的思路也很类似只不过就是去匹配具体值了，然后返回字符串喽：具体见代码

 1 /**

 2  * @method queryByKey 获取指定key的值

 3  * @param key

 4  * @default null

 5  * @return string

 6  * */

 7 function queryByKey(key){

 8     var result = location.search.match(new RegExp(key+"=[^\?\&]+","g"));

 9     var value = result?result[0].split('=')[1]:'';

10     return value;

11 }

　　3、此外在方法一的基础上还可以新增一个方法，根据索引来获取具体值：

1 /**

 2  * @method queryByKey 获取指定index的值

 3  * @param index

 4  * @default null

 5  * @return string

 6  * */

 7 function queryByIndex(index){

 8     var param = queryString()[index];

 9     var value = param ? param.split('=')[1] : ''

10     return value;

11 }

　　　一句话抛砖引玉，希望有大牛来不吝赐教。有兴趣的同学可以移步到https://github.com/xiaoxiangdaiyu/querystring-url

　　　参考文章：http://www.cnblogs.com/sunnycoder/archive/2010/02/28/1674998.html

巴特西

querystring 解析url 查询字符串

最新文章

热门文章