How to Compare Dates in JavaScript

Download Now: Introduction to JavaScript Guide
Jamie Oppel

Updated:

Published:

Dates are an essential point of consideration in day-to-day life. By that, I don’t just mean the kind where you go out to a restaurant with someone, eat mac and cheese, and stuff all the free garlic bread into your pockets. I also mean the kind that exists on your cute, cat-themed calendar where you write important reminders.

person uses javascript compare dates to simplify their calendar

In this article, you will learn about the built-in JavaScript Date object. More specifically, you will learn about comparing dates in JavaScript. You will also learn a bit of nuance regarding how their timestamps are formatted and how they are represented inside computers.

Download Now: An Introduction to JavaScript  [Free Guide]

Don’t worry! It’s probably less complicated than you might think.

What is Compare in Javascript?

Comparing things in JavaScript is relatively straightforward. You can check if something is or is not equal to, less than, or greater than something else using their related math symbols. Checking if two things are equal has a little bit of nuance, and you will learn about that shortly.

For now, look below to see a table of these operators. Assume that x is equal to 5 for all of these examples.

Table of comparison operators in JavaScript

Image Source

Take note of the difference between a double equal sign and a triple equal sign. A double equal sign only checks if the values are the same, while a triple equal sign checks that both the value and type are the same.

This is why x == “5” is true, but x === “5” is false. X may be equal to 5, but if you put quotes around the 5, it is no longer a number data type. Instead, it's a string.

How to Compare Two Dates in JavaScript

Comparing two dates in JavaScript is fairly simple. However, before you learn about that, it may be wise to learn a little more about the date object itself. That way, you will have some context for how they’re compared.

To start, dates in JavaScript are actually just numbers that represent the amount of time that has passed in milliseconds since midnight on January 1, 1970 in Coordinated Universal Time (UTC). This is colloquially referred to as “Unix time.”

This means that if you create a new Date object in JavaScript with an input of zero, it will be set to 00:00:00 January 1, 1970, using UTC or whatever your local timezone equivalent is.

As you can see, a new Date object was created and automatically converted to your local timezone. If you don’t input any parameters, it will default to the current time. That’s great and all, but using milliseconds to represent a date is not exactly practical. So, there exists another way of defining dates called the date-time string format.

Above, we have the format listed as a comment with an example date of April 25, 1995 at 6:03 p.m. PDT. You can actually omit the hour, minutes, and seconds entirely, or even specify fractions of a second to a millisecond-level precision. For more information about each part of this format, feel free to check out the mdn web docs on the date time string format.

Just to really drive the point home that dates can also be represented as integers, take a look at the following example.

Okay, you can see that the two dates are the same despite the radically different ways of creating them. So, if you compare them using the === operator, it should return true, right?

Oh no! What happened? Well, it turns out that in order to compare JavaScript dates, you need to convert them to their millisecond representation first using the getTime() method. Just make a small tweak to the above code, and you’ll be well on your way.

That’s much more like what was expected, isn’t it? Once converted into their millisecond representations, dates can be compared just like any two numbers. Now that you understand this bit of context, I can move on to a few examples just to make sure this all really sticks.

Comparing Dates Examples

The second date occurred before the first date

Above, two dates were created. One is the current time, and the other is on Christmas back in 2020. Comparing the two using a < operator shows that the 2020 date is “less than” the current date. In other words, if a date is less than another date, it means it occurred before it.

Naturally, the opposite is true as well.

The first date occurred after the second date

In this, you can see that my birthday came after my dad’s birthday. That makes sense. Even with time travel, I struggle to see how the opposite could be true.

Getting Started

That’s everything you need in order to create and compare dates in JavaScript. Now, you can get started and keep your calendar organized.

New Call-to-action

Topics: Javascript

Related Articles

Learn more about one of the world's most popular programming languages.

    CMS Hub is flexible for marketers, powerful for developers, and gives customers a personalized, secure experience

    START FREE OR GET A DEMO