How to get associative array from url query string, javascript

Question

I have url query string

?filter%5B%22customer_rating_heading%22%5D=customer_rating_6_up%2Ccustomer_rating_7_up%2Ccustomer_rating_9_up&map=1

which is

?filter["customer_rating_heading"]=customer_rating_6_up,customer_rating_7_up,customer_rating_9_up&map=1

I want to ask for filter like params.get('filter) and get

[customer_rating_heading => 'customer_rating_6_up,customer_rating_7_up,customer_rating_9_up' //(later I'll make array from this string)

But I don't know how to do this, I tried let query = Object.fromEntries(new URLSearchParams(location.search) but it gives me:

{filter["customer_rating_heading"]: "customer_rating_6_up,customer_rating_7_up,customer_rating_9_up"
map: "1"}

but I can't get filter like query.filter it's always undefined

does anyone know a solution for such problem?

Answer 1

if you want to access your filter you can use that snippet:

let [filter] = Object.keys(query).map( key => query[key] )

Answer 2

You can use URLSearchParams.entries . Here is an example:

let query = new URLSearchParams(location.search);

for(var pair of query.entries()) {
  console.log("Filter:",pair[0]); // "filter['customer_rating_heading']"
  console.log("Result:",pair[1]) // "customer_rating_6_up,customer_rating_7_up,customer_rating_9_up"
}

Here is a codepen for you to try.

Answer 3

Solution with "match"

 let query = Object.fromEntries(new URLSearchParams(location.search)) let firstKey = Object.keys(query)[0]; let found = firstKey.match(/\[(.*)\]/)[1] let key = found.replace(/\"/g, ''); let value = query[firstKey]; console.log(`${key} => ${value}`)