Не зная ключи JavaScript Object, как я могу сделать что-то вроде...
var obj = {
param1: 'something',
param2: 'somethingelse',
param3: 'another'
}
obj[param4] = 'yetanother';
... в...
var str = 'param1=something¶m2=somethingelse¶m3=another¶m4=yetanother';
...
var str = "";
for (var key in obj) {
if (str != "") {
str += "&";
}
str += key + "=" + encodeURIComponent(obj[key]);
}
Пример: http://jsfiddle.net/WFPen/
Если вы используете jQuery, это то, что он использует для параметризации параметров запроса GET ajax:
$.param( obj )
Элегантный: (при условии, что вы используете современный браузер или узел)
var str = Object.keys(obj).map(function(key) {
return key + '=' + obj[key];
}).join('&');
И эквивалент ES2017: (спасибо Лукасу)
let str = Object.entries(obj).map(([key, val]) => '${key}=${val}').join('&');
Примечание. Возможно, вы захотите использовать encodeURIComponent() если ключи/значения не имеют URL-кодировки.
ES6:
function params(data) {
return Object.keys(data).map(key => `${key}=${encodeURIComponent(data[key])}`).join('&');
}
console.log(params({foo: 'bar'}));
console.log(params({foo: 'bar', baz: 'qux$'}));ES2017 approach
Object.entries(obj).map(([key, val]) => '${key}=${val}').join('&')
Для одного уровня глубины...
var serialiseObject = function(obj) {
var pairs = [];
for (var prop in obj) {
if (!obj.hasOwnProperty(prop)) {
continue;
}
pairs.push(prop + '=' + obj[prop]);
}
return pairs.join('&');
}
Были разговоры о рекурсивной функции для произвольно глубоких объектов...
var serialiseObject = function(obj) {
var pairs = [];
for (var prop in obj) {
if (!obj.hasOwnProperty(prop)) {
continue;
}
if (Object.prototype.toString.call(obj[prop]) == '[object Object]') {
pairs.push(serialiseObject(obj[prop]));
continue;
}
pairs.push(prop + '=' + obj[prop]);
}
return pairs.join('&');
}
Это, конечно, означает, что контекст вложенности теряется в сериализации.
Если значения не начинаются с URL-адреса, и вы собираетесь использовать их в URL-адресе, проверьте JavaScript encodeURIComponent().
Только для записи, и если у вас есть браузер, поддерживающий ES6, вот решение с reduce:
Object.keys(obj).reduce((prev, key, i) => (
`${prev}${i!==0?'&':''}${key}=${obj[key]}`
), '');
И вот фрагмент в действии!
// Just for test purposes
let obj = {param1: 12, param2: "test"};
// Actual solution
let result = Object.keys(obj).reduce((prev, key, i) => (
`${prev}${i!==0?'&':''}${key}=${obj[key]}`
), '');
// Run the snippet to show what happens!
console.log(result);Object.keys(obj).map(k => '${encodeURIComponent(k)}=${encodeURIComponent(obj[k])}').join('&')
Как насчет этого? Это одна строка и никаких зависимостей:
new URLSearchParams(obj).toString();
// OUT: param1=something¶m2=somethingelse¶m3=another¶m4=yetanother
Используйте его со встроенным URL-адресом следующим образом:
const url = new URL('your_url.com');
url.search = new URLSearchParams(obj);
const response = await fetch(url);
Так как я сделал так много о рекурсивной функции, вот моя собственная версия.
function objectParametize(obj, delimeter, q) {
var str = new Array();
if (!delimeter) delimeter = '&';
for (var key in obj) {
switch (typeof obj[key]) {
case 'string':
case 'number':
str[str.length] = key + '=' + obj[key];
break;
case 'object':
str[str.length] = objectParametize(obj[key], delimeter);
}
}
return (q === true ? '?' : '') + str.join(delimeter);
}
var str = '';
for( var name in obj ) {
str += (name + '=' + obj[name] + '&');
}
str = str.slice(0,-1);
Сделайте снимок.
Пример: http://jsfiddle.net/T2UWT/
Вы можете использовать метод jQuery param:
var obj = {
param1: 'something',
param2: 'somethingelse',
param3: 'another'
}
obj['param4'] = 'yetanother';
var str = jQuery.param(obj);
alert(str);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>Полезный код, когда у вас есть массив в вашем запросе:
var queryString = Object.keys(query).map(key => {
if (query[key].constructor === Array) {
var theArrSerialized = ''
for (let singleArrIndex of query[key]) {
theArrSerialized = theArrSerialized + key + '[]=' + singleArrIndex + '&'
}
return theArrSerialized
}
else {
return key + '=' + query[key] + '&'
}
}
).join('');
console.log('?' + queryString)
Функциональный подход.
var kvToParam = R.mapObjIndexed((val, key) => {
return '&' + key + '=' + encodeURIComponent(val);
});
var objToParams = R.compose(
R.replace(/^&/, '?'),
R.join(''),
R.values,
kvToParam
);
var o = {
username: 'sloughfeg9',
password: 'traveller'
};
console.log(objToParams(o));<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.22.1/ramda.min.js"></script>Object.toparams = function ObjecttoParams(obj)
{
var p = [];
for (var key in obj)
{
p.push(key + '=' + encodeURIComponent(obj[key]));
}
return p.join('&');
};
Если вам нужна рекурсивная функция, которая будет создавать правильные параметры URL на основе данного объекта, попробуйте мой Coffee- Script.
@toParams = (params) ->
pairs = []
do proc = (object=params, prefix=null) ->
for own key, value of object
if value instanceof Array
for el, i in value
proc(el, if prefix? then "#{prefix}[#{key}][]" else "#{key}[]")
else if value instanceof Object
if prefix?
prefix += "[#{key}]"
else
prefix = key
proc(value, prefix)
else
pairs.push(if prefix? then "#{prefix}[#{key}]=#{value}" else "#{key}=#{value}")
pairs.join('&')
или скомпилированный JavaScript...
toParams = function(params) {
var pairs, proc;
pairs = [];
(proc = function(object, prefix) {
var el, i, key, value, _results;
if (object == null) object = params;
if (prefix == null) prefix = null;
_results = [];
for (key in object) {
if (!__hasProp.call(object, key)) continue;
value = object[key];
if (value instanceof Array) {
_results.push((function() {
var _len, _results2;
_results2 = [];
for (i = 0, _len = value.length; i < _len; i++) {
el = value[i];
_results2.push(proc(el, prefix != null ? "" + prefix + "[" + key + "][]" : "" + key + "[]"));
}
return _results2;
})());
} else if (value instanceof Object) {
if (prefix != null) {
prefix += "[" + key + "]";
} else {
prefix = key;
}
_results.push(proc(value, prefix));
} else {
_results.push(pairs.push(prefix != null ? "" + prefix + "[" + key + "]=" + value : "" + key + "=" + value));
}
}
return _results;
})();
return pairs.join('&');
};
Это построит такие строки:
toParams({a: 'one', b: 'two', c: {x: 'eight', y: ['g','h','j'], z: {asdf: 'fdsa'}}})
"a=one&b=two&c[x]=eight&c[y][0]=g&c[y][1]=h&c[y][2]=j&c[y][z][asdf]=fdsa"
этот метод использует рекурсию для спуска в иерархию объектов и генерирует параметры стиля рельсов, которые рельсы интерпретируют как встроенные хэши. objToParams генерирует строку запроса с дополнительным амперсандом в конце, а objToQuery удаляет конечный амперсмер.
function objToQuery(obj){
let str = objToParams(obj,'');
return str.slice(0, str.length);
}
function objToParams(obj, subobj){
let str = "";
for (let key in obj) {
if(typeof(obj[key]) === 'object') {
if(subobj){
str += objToParams(obj[key], `${subobj}[${key}]`);
} else {
str += objToParams(obj[key], `[${key}]`);
}
} else {
if(subobj){
str += `${key}${subobj}=${obj[key]}&`;
}else{
str += `${key}=${obj[key]}&`;
}
}
}
return str;
}
Вы можете использовать строку запроса npm lib
const queryString = require('query-string');
querystring.stringify({ foo: 'bar', baz: ['qux', 'quux'], corge: '' });
// Returns 'foo=bar&baz=qux&baz=quux&corge='
const obj = { id: 1, name: 'Neel' };
let str = '';
str = Object.entries(obj).map(([key, val]) => '${key}=${val}').join('&');
console.log(str);new URLSearchParams({hello: 'world', foo: 'bar' }).toString()
кажется, делает эту работу. Нет необходимости в encodeURIComponent.
Выходы hello=world&foo=bar