在JavaScript/jQuery中将对象序列化为查询字符串

Question

我正在寻找如何将对象序列化为查询字符串格式的信息，但是所有的搜索结果都淹没在了反向操作（从字符串/表单/其他转换为JSON）的内容中。

我有

{ one: 'first', two: 'second' }

我想要

?one=first&two=second

有没有好的方法可以实现这个？我不介意使用插件或其他什么 - 如果我找到的代码不是插件，我可能会重新编写成一个插件...

- Tomas Aschan

---

以下是一些不错的纯JS解决方案：https://dev59.com/enI-5IYBdhLWcg3wta1q 其中一些解决方案并不比这里提供的框架解决方案更长。 - Simon Steinberger

Answer 1

您需要使用$.param()：http://api.jquery.com/jQuery.param/

具体来说，您需要以下内容：

var data = { one: 'first', two: 'second' };
var result = $.param(data);

当给出这样的东西：

{a: 1, b : 23, c : "te!@#st"}

$.param将返回如下内容：

a=1&b=23&c=te!%40%23st

- Chris Laplante

---

请注意，如果您的对象中有一个数组，它将无法正确地获得参数化。 - crv

@crv: 对的。在这种情况下，JSON 可能是最好的选择。 - Chris Laplante

@crv 我的代码中有一个数组，它运行得很好。 - Danyal Aytekin

这个在asp.net 4.0中不起作用，因为查询字符串中有&，除非你明确设置了requestValidationMode="2.0"。 - Amicable

它不能正确处理嵌套对象。 - newman

完美运行。 - rzshss

Answer 2

对于一个快速的非jQuery函数...

function jsonToQueryString(json) {
    return '?' + 
        Object.keys(json).map(function(key) {
            return encodeURIComponent(key) + '=' +
                encodeURIComponent(json[key]);
        }).join('&');
}

请注意，此方法不处理数组或嵌套对象。

- Rich Smith

---

很酷，运行正常！我只是添加了 if ( json[key] != null ) 来省略空值。 - Valentin H

这是一个不错的JavaScript解决方案。可以将Object.keys的调用分配给一个params变量，并在对象可能为空（即json={}）的情况下使用return params.length && params.join('&') || ""。 - t.888

这比 $.param 更好，因为 param 是针对表单而不是 URL 编码的。因此，使用 param 时，空格会变成 + 而不是 %20，这可能会导致各种问题，特别是在 MVC 中。 - NibblyPig

使用ES6，对于简单的JavaScript对象来说，这是一个相当干净和整洁的解决方案。https://gist.github.com/magician11/c16ae65cacd5cdb793f5f8215c1ef811 - magician11

jsonToQueryString({ query: true, options: { nested: true }}) is return object[Object] :( ?query=true&options=%5Bobject%20Object%5D - Aral Roca

Answer 3

另一个选项可能是node-querystring。 我一直在使用它，因为它在npm和bower中都可用。

- wprl

Answer 4

另外，YUI还有http://yuilibrary.com/yui/docs/api/classes/QueryString.html#method_stringify方法。

例如：

var data = { one: 'first', two: 'second' };
var result = Y.QueryString.stringify(data);

- Alex Stetsenko

---

它已经不再维护了。 - Valentin H