Two string methods every JavaScript developer should know.

The Challenge:

I was working on a project recently where I was required to build an endpoint that enabled the client to be able to query the Mongo database based on a single date, and also a date range. I know, exciting!

Here's the thing though, while testing the endpoint, I realized that I wasn't successfully querying the db because I was getting the date in this form '"2019-08-02T00:00:00.000Z"'. Meanwhile I needed it in this form: '2019-08-02'. So I needed to separate the time from the date-time string and remove the double quotes from the string.

In case you're interested, I wrote about how to query NoSQL databases with date-ranges here:

How to query documents in MongoDB that fall within a specified date range using Mongoose and Node.

Audiophile ・ Nov 7 '19

#node #javascript #mongodb #mongoose

What I tried:

I did what every respectable developer does when they hit roadblocks: I scoured the realms of Stack Overflow looking for a RegEx to solve the issue!

While searching, I saw lots of answers that worked but didn't make any sense to me, and I wasn't quite comfortable with adding that to the code base. Fixing code that works but you don't understand is a practice I'd rather not get used to.

I came across an answer that used the JavaScript string's split() method. I became curious and searched for the String object on Google, just to see what came up. I won't bother you with too much talk on all the different methods I found. I'll only bother you with the two that solved my challenge.

String.prototype.split() in action!

A quick search on M.D.N describes the split() method as such:
The split() method turns a String into an array of strings, by separating the string at each instance of a specified separator string.

You may be thinking "Uh-huh, in English please...", no worries, I thought the same. So here's an alternative definition:

The split method helps you cut down a desired Mama String into smaller child strings and it performs this separation based on the condition you give it. It then returns the answer back to you as an Array

This condition is called a separator. A very important thing to note about the separator is that it must exist in the string. So if you instruct the split method and say:
"Hey I want you to cut down a Mama String called data into smaller child strings using a comma."

Split says ok and jumps to action!

let data = "data";

data = data.split(',');

console.log(data);

//Expected Result: ["data"];

You may be thinking, "hold up, Mr. split, don't think you can fool me by fixing the string I passed to you by putting it into an array". Don't be too hasty there, here's what happened; we told split() to give us child strings from the Mama string we passed to it using a separator that wasn't part of the Mama string. So the Mama string looks at itself and is like "I don't have any commas, so I can't be separated by it".

However, what if we tweaked our separator to a similar value, say the letter "a". Let's see:

let data = "data";

data = data.split('a');

console.log(data);

//Expected Result: ["d", "t", ""];   

Aha! We get little child strings wherever the letter a was found. So Mr. split() takes the separator and uses it as a mini-search criteria where the Mama string is cut down wherever the separator shows. Then it skips the separator and returns anything after it also, hence the "" we get as part of our result above.

But what if we wanted the separation in just a number of places?

That's okay too, split() makes that convenient for you by providing an optional limit parameter you can fix into it. The catch though, is that once the limit is reached, split stops trying to separate the Mama string and gives you only what has been separated so far. So assuming we wanted our "data" string to be split by the letter "a" just once and no more, we would get something like this:

let data = "data";

data = data.split('a', 1);

console.log(data);

//Expected Result: ["d"];   

Okay but how does this fix my Date-Time problem?
If you recall, I had a date-time string that looked like this: '"2019-08-02T00:00:00.000Z"'. With the brand new knowledge I gained, I could then do away with the timestamp part of the date-time I got. So I would have something like this:

   let date = '"2019-08-02T00:00:00.000Z"';

    date = date.split('T', 1);

   console.log(date);

   //Expected result: ['"2019-08-02"]

Now I have my date! But how about the double-quotes issue though? How do I solve that?

String.prototype.replace() to the rescue!

Here's what replace() does, it takes in the string you want gone as the first parameter, and the string you want to introduce as the second parameter. So it goes like this:

string.replace(/stringIHate/,'StringILove')

It uses double forward-slashes to house the string you want gone. This also allows you to add things like the letters i to instruct that you want the search to be case-insensitive or g to instruct that you want the search to be global i.e. everywhere it is found in the string.

So to resolve our issue, we'd use it as such:

   let date = '"2019-08-02T00:00:00.000Z"';

    date = date.split('T', 1);

   console.log(date);

   //Expected result: ['"2019-08-02"]

  //REPLACE METHOD
   date = date[0].replace(/"/,"");

   console.log(date);

   //Expected result: "2019-08-02"

Voila! I finally have my date in the form I want it. I did so by telling Mr. replace() to search through my string in the returned array, look for double quotes and replace them with nothing.

Chaining replace() and split(): A better way.

In order to boost efficiency, we could shorten the lines of code we need to write by chaining string methods together. Also, it would be better to call the replace function on the string first before calling the split function because it makes our code shorter. Hence we could condense the code as such:

   let date = '"2019-08-02T00:00:00.000Z"';

   date = date.replace(/"/g, "").split('T',1);

  console.log(date);

 // Expected Result: ["2019-08-02"];

//This is shorter and more semantic than:
date = date.split('T',1)[0].replace(/"/g, "");

//You could do that however if you don't want the string to be returned as an array

Conclusion

I hope you found that helpful. Before you reach out for a Regular Expression you-don't-quite-understand-but-works to solve your string-related issues, try to take a deeper look at JavaScript string methods. Please like, share and leave comments so more people who need this can see it!

What other String methods have helped make life easy for you?