Serialize an array of objects

Question

I have a function that queries a Rest API. The function call looks like:

var filters = [
    {field: "TestField", "params[value]": "VIDEO"},
    {field: "TestField2", "params[value]": "IMAGE"},
];

this.query({limit: 10, text:"Test", filters: filters});

I want to build a query string that looks like:

?limit=10&text="Test"&filters[0].field=TestField&filters[0].params[value]=VIDEO&filters[1].field=TestField2&filters[1].params[value]=IMAGE

What is the best/fastest way to do that in JavaScript regarding the filters array?

I see you're using Underscore, but are you also using jQuery? — ncksllvn, Oct 27 '14 at 15:34
Okay, and what is `params[value]`? That code definitely runs? — ncksllvn, Oct 27 '14 at 15:37
My question is: What is the best way to build the query string that I posted in my question. — mAtZ, Oct 27 '14 at 15:39
You can't use `params[value]` as a key of an object literal. Either use a string `"params[value]"`, or use EcmaScript6 computed property names `[params[value]]`. — Oriol, Oct 27 '14 at 15:39
Have a look at http://api.jquery.com/jquery.param/, but note the ... not. You might be better off serializing the data to JSON. — Felix Kling, Oct 27 '14 at 15:40
possible duplicate http://stackoverflow.com/questions/3308846/serialize-object-to-query-string-in-javascript-jquery — DLeh, Oct 27 '14 at 15:41

score 0 · Accepted Answer · answered Oct 27 '14 at 16:09

Array.prototype.map is your friend:

var filters = [
    {field: "TestField", "params[value]": "VIDEO"},
    {field: "TestField2", "params[value]": "IMAGE"},
];

var qs = filters.map(function(filter,i){
    return "filters[" + i + "].field=" +
            encodeURIComponent(filter.field) +
            "&filters[" + i + "].params[value]=" +
            encodeURIComponent(filter["params[value]"]);
}).join("&");

Serialize an array of objects

1 Answers1