How to Convert Object to QueryString Parameters and Back in JavaScript

In this tutorial, will show you some ways to convert an object to Query String Parameters and Back in JavaScript

Are you having an object like this:

var params = {
    a: 1,
    b: 2,
    c: 3
};

And you want to convert to:

"a=1&b=2&c=3"

Using map and join

# ES6
var query = Object.keys(params).map(key => key + '=' + params[key]).join('&');

# ES5
var query = Object.keys(params).map(function(key) {
    return key + '=' + params[key]
}).join('&');

If you know you’re keys and values need to be encoded, you should use encodeURIComponent like this:

var query = Object.keys(params).map((key) => {
    return encodeURIComponent(key) + '=' + encodeURIComponent(params[key])
}).join('&');

Convert URL parameters to a JavaScript object

var query = "a=1&b=2&c=3";
var obj = JSON.parse('{"' + decodeURI(query).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g,'":"') + '"}');
console.log(obj);

# return { a: '1', b: '2', c: '3' }

Use decodeURIComponent

JSON.parse('{"' + query.replace(/&/g, '","').replace(/=/g,'":"') + '"}', function(key, value) { return key===""?value:decodeURIComponent(value) })

Happy Coding!

#javascript