将查询字符串反序列化为JSON对象

Question

试图找到如何使{foo:"bar"}从?...&foo=bar&...而是一派,只拿到了到jQuery.params这则正好相反.请问任何建议(内置javascript函数,jquery,underscore.js - 一切顺利)？或者,我是否需要自己实施(不是很麻烦,只是试图不重新发明轮子)？

Answer 1

实际上@talsibony的上述答案没有考虑查询字符串数组(例如test=1&test=2&test=3&check=wow&such=doge).这是我的实施:

function queryStringToJSON(qs) {
    qs = qs || location.search.slice(1);

    var pairs = qs.split('&');
    var result = {};
    pairs.forEach(function(p) {
        var pair = p.split('=');
        var key = pair[0];
        var value = decodeURIComponent(pair[1] || '');

        if( result[key] ) {
            if( Object.prototype.toString.call( result[key] ) === '[object Array]' ) {
                result[key].push( value );
            } else {
                result[key] = [ result[key], value ];
            }
        } else {
            result[key] = value;
        }
    });

    return JSON.parse(JSON.stringify(result));
};

Answer 2

在现代浏览器中，您还可以使用Object.fromEntries这使得这变得更加容易。

\n

\r\n

\r\n

function queryStringToObject(queryString) {\n  const pairs = queryString.substring(1).split(\'&\');\n  // \xe2\x86\x92 ["foo=bar", "baz=buzz"]\n\n  var array = pairs.map((el) => {\n    const parts = el.split(\'=\');\n    return parts;\n  });\n  // \xe2\x86\x92 [["foo", "bar"], ["baz", "buzz"]]\n\n  return Object.fromEntries(array);\n  // \xe2\x86\x92 { "foo": "bar", "baz": "buzz" }\n}\n\nconsole.log(queryStringToObject(\'?foo=bar&baz=buzz\'));

\r\n

\r\n

\r\n

\n

\n

URLSearchParams接口可以与浏览器 URL 搜索参数交互。\n浏览器对URLSearchParams的支持相当不错。

\n

对于你的情况，它将是：

\n

\r\n

\r\n

console.log(\n  Object.fromEntries(new URLSearchParams(\'foo=bar&baz=buzz\'))\n);

\r\n

\r\n

\r\n

\n

Answer 3

我在这里发布我的函数以防万一其他会看起来并希望直接得到它不需要jquery本机JS.因为我一直在寻找同样的东西,并在查看其他答案后终于完成了这个功能:

function queryStringToJSON(queryString) {
  if(queryString.indexOf('?') > -1){
    queryString = queryString.split('?')[1];
  }
  var pairs = queryString.split('&');
  var result = {};
  pairs.forEach(function(pair) {
    pair = pair.split('=');
    result[pair[0]] = decodeURIComponent(pair[1] || '');
  });
  return result;
}


console.log(queryStringToJSON(window.location.href)); 
console.log(queryStringToJSON('test=1&check=wow'));//Object {test: "1", check: "wow"}

Answer 4

你有本阿尔曼jQuery BBQ和其中的一个jQuery.deparam.它被描述为The opposite of jQuery.param, pretty much.

http://benalman.com/code/projects/jquery-bbq/examples/deparam/

第一个例子就是你需要的.