Enter Your Email Address to Watch This Lesson

Your link to unlock this lesson will be sent to this email address.

Unlock this lesson and all 971 of the free egghead.io lessons, plus get JavaScript content delivered directly to your inbox!



Existing egghead members will not see this. Sign in.

Convert a QueryString to an Object using Function Composition in Ramda

2:13 JavaScript lesson by

In this lesson we'll use a handful of Ramda's utility functions to take a queryString full of name/value pairs and covert it into a JavaScript object so we can access those properties in a more useful way. Along the way, we'll build up a composition and look at the tail, split, map and fromPairs functions, along with the crucial compose function.

Get the Code Now
click to level up

egghead.io comment guidelines

Avatar
egghead.io

In this lesson we'll use a handful of Ramda's utility functions to take a queryString full of name/value pairs and covert it into a JavaScript object so we can access those properties in a more useful way. Along the way, we'll build up a composition and look at the tail, split, map and fromPairs functions, along with the crucial compose function.

Here, I'm requiring Ramda, and I'm using destructuring to get a handful of its functions. I also have a querystring value defined, and a parseqs function that right now just uses identity. It's going to take whatever value we give it, and spit it right back out. Of course, I'm logging out my result.

I want to take this query_string value, and I want to parse it into an object so that I end up with a page property, a page size property, and a total property. The first thing I need to do is get rid of this question mark value.

I'm going to replace identity here with a call to tail. tail will take in our string, and it'll give us back all the characters except for the very first one. If I save this, switch to the terminal, and run it, we'll get our string back, minus the leading question mark.

Now that the string is down to just what we need, we need to break apart the key-value pairs. I'm going to make this composition, I'll use the compose function that I pulled in from Ramda. This is going to go from right to left.

After tail, we're going to split on the ampersands. Just so we can see our progress, I'm going to save that, and switch over to the terminal, run this again. Now, we're getting back an array of strings, and each one of those strings represents one of our key-value pairs.

Now that we have that, we need to take each one of those strings, and break those apart so that we can separate our key from our value. In order to do that, I'm going to map, because we need to do the same operation to each item in this array.

I'm going to split those. This time, I'm going to split on the equals sign. If I save this and run it again, and we'll end up with an array of arrays. Each of the inner arrays is going to represent a key and a value pair, but now, those items are separate, instead of being part of one string.

Now, what we can do is we can jump back into the code. Ramda actually has a function that's exactly what we need for this, called "fromPairs." fromPairs is going to take in arrays that have two items. For each one of those two-item arrays, it's going to create a property and value pair in an object.

When I save this, switch back over to the terminal, and I run it again, now, we have an object that represents our query string in a way that we can use it easily within our JavaScript code.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?