How to make query string always return an array?

Question

I am using query string (https://www.npmjs.com/package/qs) to parse the params in the URL like so:

http://www.website.com/?filter="bags"&filter="shirts"

However, if I have no filter or just one filter it will return either a string or undefined:

http://www.website.com/?filter="bags" // returns 'bags'
http://www.website.com/ // returns undefined

The reason being I need to feed this result into functions / methods that use an array.

One solution I thought of is to sort of create condition depending on what it returns:

if (typeof query == 'string') {
    query = [query];
} else if (query == undefined) {
    query = [];
}

But this seems not optimal. Wondering if the result can just be an array all time instead.

Mamun · Accepted Answer · 2018-09-25 05:41:34Z

1

I think there is nothing much you can do. Though, you can use ternary operator to reduce some code. The following will return an empty array if query does not have anything:

if(!Array.isArray(query))
  query = !!query ? [query] : [];

edited Sep 25, 2018 at 5:41

answered Sep 25, 2018 at 4:43

Mamun

69k9 gold badges51 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Soroush Chehresa Over a year ago

You edited your answer exactly like mine but what is the purpose of posting the same answer?

Mamun Over a year ago

@soroushchehresa, the same I could say, like I have used ternary operator even before you answered......more over, without any explanation what the code is doing how the answer could help someone!!!

Soroush Chehresa Over a year ago

Maybe it can be a reason but not compelling!

catandmouse Over a year ago

This solution seems to wrap the array into another array. I think coz the first condition satisfies both string and array.. so it wraps the array into another array.

Mamun Over a year ago

@catandmouse, you are right. Just wanted to know, in any case, could query be an array before modifying?

|

Kyaw Kyaw Soe · Accepted Answer · 2018-09-25 04:58:51Z

1

The reason being I need to feed this result into functions / methods that use an array.

i think the better solution is instead of checking query is array orundefined, you can add default param of function/method to be array

example

function yourFunction(query = []){
    return query;
}

answered Sep 25, 2018 at 4:58

Kyaw Kyaw Soe

3,4001 gold badge16 silver badges25 bronze badges

2 Comments

vol7ron Over a year ago

so what if it's a string or an integer?

Kyaw Kyaw Soe Over a year ago

@vol7ron don't worry qs parse will return either a string or undefined.

Soroush Chehresa · Accepted Answer · 2018-09-25 05:47:51Z

1

I think you could do:

query = !!query ? Array.isArray(query) ? query : [query] : [];

or:

if(!!query) {
  if(!Array.isArray(query)) {
    query = [query];
  }
} else {
  query = [];
}

edited Sep 25, 2018 at 5:47

answered Sep 25, 2018 at 4:46

Soroush Chehresa

5,6981 gold badge16 silver badges30 bronze badges

Comments

Amruth · Accepted Answer · 2018-09-25 04:41:16Z

0

Do this way, if condition checks query is undefined or not.

if (query) {
   query = [query];
} else {
   query = [];
}

answered Sep 25, 2018 at 4:41

Amruth

5,9122 gold badges30 silver badges41 bronze badges

Comments

moritz.vieli · Accepted Answer · 2018-09-25 04:43:45Z

0

You could do something like this:

var filter = [];

if(query) {
  filter.push(query);
}

This way, filter would always be an array and contain the query filters, if provided. This pattern is not uncommon.

answered Sep 25, 2018 at 4:43

moritz.vieli

1,8271 gold badge15 silver badges17 bronze badges

Comments

Bhojendra Rauniyar · Accepted Answer · 2018-09-25 05:13:16Z

0

I would initialize an empty query. Suppose, your query is stored in state, then:

const { query } = this.state || { query: [] }

Or, simply initialize the query with empty array in the state:

state = {
  query: [] // rather than ''
}

Now, you should only set the query state when it has value inside your handler:

const query = e.target.value // or whatever the source you get the query from
if(query) {
  this.setState({query: [query]})
}

edited Sep 25, 2018 at 5:13

answered Sep 25, 2018 at 5:07

Bhojendra Rauniyar

86k36 gold badges179 silver badges241 bronze badges

Comments

vol7ron · Accepted Answer · 2018-09-25 05:27:28Z

0

Another option in addition to the many existing answers it that you could always wrap it and then filter out the undefineds:

let str = 'str';
console.log( [str].filter(v=>v!==undefined) )   // [ 'str' ]

let undf;
console.log( [undf].filter(v=>v!==undefined) )  // [ ]

// Example: filter out undefined
query = [query].filter(v=>v!==undefined)

// Example: passing in a Boolean constructor, since non-empty strings are truthy
query = [query].filter(Boolean)

edited Sep 25, 2018 at 5:27

answered Sep 25, 2018 at 5:13

vol7ron

42.3k22 gold badges126 silver badges178 bronze badges

Collectives™ on Stack Overflow

How to make query string always return an array?

7 Answers 7

7 Comments

2 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

7 Comments

2 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related