查詢字符串轉(zhuǎn)對象

接下來給大家介紹一個封裝的函數(shù)，可以通過這個函數(shù)將一個url地址中的查詢字符串提取出來，并且轉(zhuǎn)換為一個對象。

總所周知，url地址的組成為：

            協(xié)議：//域名：端口/資源路徑？查詢字符串#hash

        通過這個我們可以發(fā)現(xiàn)，查詢字符串在url地址中是在“？”后面“#”號的前面，但是查詢字符串和#hash都是可以有可無的，所以我們就需要先進(jìn)行一個判斷，然后再進(jìn)行接下來的操作。在判斷之前我們需要先獲取“？”和“#”在url字符串中的索引位置。

    var star = url.indexOf("?"),//查詢字符串起始位置索引
        end = url.indexOf("#");//查詢字符串結(jié)束位置索引

然后再判斷“？”和“#”是否存在。

    if(star === -1) //判斷是否存在查詢字符串,返回-1則不存在
        return null;
    star += 1;//后面用slice（）方法截取查詢字符串，所以我們需要將star的值加一
    if(end === -1) //判斷是否有#hash
        end = url.length;

判斷結(jié)束之后就可以進(jìn)行轉(zhuǎn)換了，代碼如下

    var str = url.slice(star, end);//截取查詢字符串
    str = str.split("&");//將字符串切割為一個一個的等式
    var obj = {};
        for(var i in str){
            var strs = str[i].split("=");//將等式切割為左右兩個元素，左邊的是對象的name，右邊則是相應(yīng)的值
            obj[strs.shift()]=strs.shift();//添加到對象中
        }
    return obj;

這樣，這個函數(shù)就定義好了。

注：slice（start，end）方法是從索引為start的位置截取到索引為end的位置，包括start，但是不包括end。




歡迎關(guān)注微信公眾號:猴哥說前端