序列化对象以在 JavaScript/jQuery 中查询字符串 [重复]

Posted 2023-02-23

【中文标题】序列化对象以在 JavaScript/jQuery 中查询字符串 [重复]

【英文标题】：Serialize object to query string in JavaScript/jQuery [duplicate]

【发布时间】：2011-03-19 12:58:42

【问题描述】：

我正在尝试查找有关如何将对象序列化为查询字符串格式的信息，但我所有的搜索都淹没在有关如何采用另一种方式（字符串/表单/JSON 的任何内容）的结果中。

我有

 one: 'first', two: 'second' 

我想要

?one=first&two=second

有什么好办法吗？我不介意插件或诸如此类的东西 - 如果我找到的代码不是插件，我可能会重新编写它......

【问题讨论】：

这里有一些不错的纯 JS 解决方案：***.com/questions/1714786/… 其中一些并不比这里的框架解决方案长。

【参考方案1】：

另一个选项可能是node-querystring。

它在npm 和bower 都可用，这就是我一直在使用它的原因。

【参考方案2】：

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

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

请注意，这不处理数组或嵌套对象。

【讨论】：

酷，工作！我只添加了if ( json[key] != null ) 来省略空值

这是一个不错的纯 javascript 解决方案。对于对象可能为空的情况，例如 json=，可以将调用 Object.keys 分配给 params 变量和 return params.length && params.join('&') || ""。

这比$.param 效果更好，因为param 对表单而不是url 进行编码，所以param space 变成+ 而不是%20 这可能会导致各种问题，尤其是使用MVC

使用 ES6 对于简单的 JavaScript 对象来说这是一个非常干净整洁的解决方案gist.github.com/magician11/c16ae65cacd5cdb793f5f8215c1ef811

jsonToQueryString( query: true, options: nested: true ) 是返回对象[Object] :( ?query=true&options=%5Bobject%20Object%5D

【参考方案3】：

你想要$.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

【讨论】：

请注意，如果您的对象中有一个数组，则它不会被正确参数化。

@crv：对。在这种情况下，JSON 可能是最好的

@crv 我有一个数组，它工作正常。

这不适用于 asp.net 4.0，因为查询字符串中的 & 没有你专门设置你的 requestValidationMode="2.0"

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

【参考方案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);

【讨论】：

不再维护了。