压扁一个JavaScript对象，以查询string的forms传递

我有一个JavaScript对象，我需要扁平化为一个string，以便我可以传递查询string，我该怎么做？ 即：

{ cost: 12345, insertBy: 'testUser' }将成为cost=12345&insertBy=testUser

我不能使用jQuery AJAX调用这个调用，我知道我们可以使用它，并将data作为data传递，但在这种情况下不能。 使用jQuery来扁平化为对象虽然可以。

谢谢。

Answer 1

你想要jQuery.param ：

 var str = $.param({ cost: 12345, insertBy: 'testUser' }); // "cost=12345&insertBy=testUser" 

请注意，这是jQuery内部用于序列化作为dataparameter passing的对象的函数。

Answer 2

这是一个非jQuery版本：

 function toQueryString(obj) { var parts = []; for (var i in obj) { if (obj.hasOwnProperty(i)) { parts.push(encodeURIComponent(i) + "=" + encodeURIComponent(obj[i])); } } return parts.join("&"); } 

Answer 3

我的ES6版本（纯Javascript，没有jQuery）：

 function toQueryString(paramsObject) { return Object .keys(paramsObject) .map(key => `${encodeURIComponent(key)}=${encodeURIComponent(paramsObject[key])}`) .join('&') ; } 

Answer 4

试试$.param()方法：

 var result = $.param({ cost: 12345, insertBy: 'testUser' }); 

Answer 5

这里是另一个非jQuery版本，如果您已经使用了这些库中的一个，它将使用lodash或下划线：

 var toQueryString = function(obj) { return _.map(obj,function(v,k){ return encodeURIComponent(k) + '=' + encodeURIComponent(v); }).join('&'); }; 

Answer 6

这是一个古老的问题，但在谷歌search的顶部，所以我join这个完整性。

如果1）你不想用户jQuery，但是2）你想隐藏一个嵌套的对象到一个查询string，然后（从Tim Down和Guy的答案构build），使用这个：

 function toQueryString(obj, urlEncode) { // // Helper function that flattens an object, retaining key structer as a path array: // // Input: { prop1: 'x', prop2: { y: 1, z: 2 } } // Example output: [ // { path: [ 'prop1' ], val: 'x' }, // { path: [ 'prop2', 'y' ], val: '1' }, // { path: [ 'prop2', 'z' ], val: '2' } // ] // function flattenObj(x, path) { var result = []; path = path || []; Object.keys(x).forEach(function (key) { if (!x.hasOwnProperty(key)) return; var newPath = path.slice(); newPath.push(key); var vals = []; if (typeof x[key] == 'object') { vals = flattenObj(x[key], newPath); } else { vals.push({ path: newPath, val: x[key] }); } vals.forEach(function (obj) { return result.push(obj); }); }); return result; } // flattenObj // start with flattening `obj` var parts = flattenObj(obj); // [ { path: [ ...parts ], val: ... }, ... ] // convert to array notation: parts = parts.map(function (varInfo) { if (varInfo.path.length == 1) varInfo.path = varInfo.path[0];else { var first = varInfo.path[0]; var rest = varInfo.path.slice(1); varInfo.path = first + '[' + rest.join('][') + ']'; } return varInfo; }); // parts.map // join the parts to a query-string url-component var queryString = parts.map(function (varInfo) { return varInfo.path + '=' + varInfo.val; }).join('&'); if (urlEncode) return encodeURIComponent(queryString);else return queryString; } 

使用像：

 console.log(toQueryString({ prop1: 'x', prop2: { y: 1, z: 2 } }, false)); 

哪些产出：

 prop1=x&prop2[y]=1&prop2[z]=2 

Answer 7

另一个版本：

 function toQueryString(obj) { return Object.keys(obj).map(k => { return encodeURIComponent(k) + "=" + encodeURIComponent(obj[k]) }) .join("&"); } 

Answer 8

 var myObj = { cost: 12345, insertBy: 'testUser' }, param = '', url = 'http://mysite.com/mypage.php'; for (var p in myObj) { if (myObj.hasOwnProperty(p)) { param += encodeURIComponent(p) + "=" + encodeURIComponent(myObj[p]) + "&"; } } window.location.href = url + "?" + param; 

Answer 9

一般的JavaScript：

 function toParam(obj) { var str = ""; var seperator = ""; for (key in obj) { str += seperator; str += enncodeURIComponent(key) + "=" + encodeURIComponent(obj[key]); seperator = "&"; } return str; } toParam({ cost: 12345, insertBy: 'testUser' }) "cost=12345&insertBy=testUser" 

Answer 10

你可以使用这个

 function serialize(obj) { let str = [] for(var p in obj) { if(obj.hasOwnProperty(p)) str.push(encodeURIComponent(p) + '=' + encodeURIComponent(obj[p])) } return str.join('&') } 

试试JSFiddle这个链接https://jsfiddle.net/yussan/kwmnkca6/

Answer 11

Jrop的答案 ES6版本（也parsing嵌套参数）

 const toQueryString = (obj, urlEncode = false) => { if (!obj) return null; const flattenObj = (x, path = []) => { const result = []; Object.keys(x).forEach((key) => { if (!Object.prototype.hasOwnProperty.call(x, key)) return; const newPath = path.slice(); newPath.push(key); let vals = []; if (typeof x[key] === 'object') { vals = flattenObj(x[key], newPath); } else { vals.push({ path: newPath, val: x[key] }); } vals.forEach((v) => { return result.push(v); }); }); return result; }; let parts = flattenObj(obj); parts = parts.map((varInfo) => { if (varInfo.path.length === 1) { varInfo.path = varInfo.path[0]; // eslint-disable-line no-param-reassign } else { const first = varInfo.path[0]; const rest = varInfo.path.slice(1); varInfo.path = `${first}[${rest.join('][')}]`; // eslint-disable-line no-param-reassign } return varInfo; }); const queryString = parts.map((varInfo) => { return `${varInfo.path}=${varInfo.val}`; }).join('&'); if (urlEncode) { return encodeURIComponent(queryString); } return queryString; };