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:
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?
Latest comments (35)
As the old joke goes "I decided to use regex and now I have 2 problems"... regex is a very useful tool but doesn't need to be your only tool, and as usual with programming it's easy to overcomplicate things.
What happened here is that you got a datetime object formatted as json. So yes you could manually parse the json (it is pretty trivial after all), but there's a built-in solution to handle this: JSON.parse().
After you've done that you'll have to deal with the fact that JavaScript's datetime library is about as bad as possible. So instead of dealing with the catastrophe that the built-in API is, simply use moment.js. Which combined results in the rather pleasant
moment(JSON.parse(inputStr)).format('YYYY-MM-DD')(You should obviously do error handling along the way).
Why would you parse the date manually and then format it manually? Use Date.parse and toLocaleString stackoverflow.com/a/34015511/227299
-1
If I have to do this, I will use only regex replace instead of using both split and regex, where regex only already can achieve this :
var str = '"2019-08-02T00:00:00.000Z"';
var res = str.replace(/.*(\d{4}\-\d{2}\-\d{2}).*/, "$1");
This way also will not care about other string inside the string, it will just try to find 9999-99-99 and remove others.
It will accept any format with this pattern.
Eg. :
2019-08-02 00:00:00
Friday, 2019-08-02 00:00:00
Great explanations that even a noob like me can understand! Thank you! I'll be looking for more articles from you in the future.
I'm glad it helped!
date.substr(1,11);
That would include the Z in the string ;)
Haha turns out substr would get the T not the Z and substring would get the correct string with the same args
Both of you are wrong but okay... it would not get either.
date= '"2019-08-02T00:00:00.000Z"';
console.log(date.substr(1,11);
go ahead and run in your console. I'll wait.
jsfiddle.net/brandito/9h68qnyo/5/
Nicely done. You can certainly use regex in the future, but this time around you discovered the magic of split and replace for string manipulation. More tools in your code toolbox.
Very cool. Thanks Sir!
So far is fine to play a bit with strings. But I'd like to share from my experience, always try to manipulate the objects with their respective API. In this case you are facing a formatted string RFC-3339, and you want to extract its = date-fullyear "-" date-month "-" date-mday
I highly recommend to avoid regex. You should implement Date API, you can achieve easily with 2 lines of code and solid code scalable. As many other answered to you, try to play with Date, as example:
const date = new Date("2019-08-02T00:00:00.000Z")
const fullDate =
${date.getFullYear()}-${date.getMonth()}-${date.getDay()}Note: toLocaleString is experimental and not stable yet.
You may normalize getMonth and getDay to add 0 to the left when needed.
"Note: toLocaleString is experimental and not stable yet."
For Date (and most other built-in objects)? No it isn't.
developer.mozilla.org/en-US/docs/W...
They would have still needed to use string.replace to remove the double quotes around the date string, but I prefer your approach of using the Date APIs to ensure you're always going to get the same result.
Not necessarily, you could do it with String.slice or JSON.parse instead.
Since you know the exact input maybe less is more here?
let date = '"2019-08-02T00:00:00.000Z"';
date = date.substr(1, 10);