When working with JavaScript, it's common to encounter situations where you need to compare dates. This can be a bit tricky, as dates in JavaScript are represented by objects rather than primitive values. In this article, we'll explore several methods for comparing dates in JavaScript.
In JavaScript, you can create a new date by calling the Date()
constructor. For example:
const date1 = new Date('2023-03-01');
const date2 = new Date('2022-10-31');
This creates two date objects, one for March 1st, 2023 and one for October 31st, 2022.
Before comparing times
Before we dive into comparing dates, it's important to understand that JavaScript stores dates as the number of milliseconds since January 1st, 1970. This means that when you create a new date object, you're also creating an object with a time component. If you don't set the time component, it will default to midnight (00:00:00).
Note that when comparing dates, it is important to ensure that they are both in the same time zone, otherwise the comparison may not be accurate.
Using comparison operators
One way to compare dates is to use comparison operators like <
and >
. The comparison operators can be used to compare two dates. When two date objects are compared using these operators, they are compared based on their numeric value, which is the number of milliseconds between the dates.
Here is an example of using comparison operators to execute date comparison
const date1 = new Date("2023-03-01");
const date2 = new Date("2022-10-31");
if (date1 > date2) {
console.log("Deploy App");
} else {
console.log("Waiting on resources");
}
Output
Deploy App
In this example, we're checking if date1
is greater than date2
, and since it is, it logs "Deploy App"
.
Using the getTime()
method
Another way to compare dates is to use the getTime()
method. This method returns the number of milliseconds since January 1st, 1970 for a given date object.
const date1 = new Date("2023-03-01");
const date2 = new Date("2022-10-31");
if (date1.getTime() > date2.getTime()) {
console.log("First Date is greater. Wow");
}
Output
First Date is greater. Wow
In this example, we're checking if the number of milliseconds since January 1st, 1970 for date1
is greater than the number of milliseconds since January 1st, 1970 for date2
.
Here's another example
const date1 = new Date("2023-01-01");
const date2 = new Date("2023-01-01");
if (date1.getTime() === date2.getTime()) {
console.log("Equal");
}
Output
Equal
In this example, we're checking if the number of milliseconds since January 1st, 1970 for date1
is equal to the number of milliseconds since January 1st, 1970 for date2
.
Using the valueOf()
method
The valueOf()
method is similar to the getTime()
method, but it returns the primitive value of a date object. So, the valueOf()
method returns the primitive value of a Date object as the number of milliseconds since January 1, 1970, 00:00:00 UTC. This method can also be used to compare two dates. Let’s illustrate this with some code
const date1 = new Date("2023-03-01");
const date2 = new Date("2022-10-31");
if (date1.valueOf() > date2.valueOf()) {
console.log("Launch Day is Here");
}
Output
Launch Day is Here
In this example, we're checking if the primitive value of date1
is greater than the primitive value of date2
.
Using the getTime()
method and the Math.sign()
method
If you need to compare dates and determine whether one is before or after another, you can use the getTime()
method in combination with the Math.sign()
method. The Math.sign()
method returns the sign of a number, indicating whether the number is positive, negative, or zero. By subtracting the getTime()
values of the two dates and passing the result to the Math.sign()
method, we can determine which date is greater.
Here is an example of how to use getTime()
and Math.sign()
method to compare dates.
const date1 = new Date("2023-03-01");
const date2 = new Date("2022-10-31");
const difference = Math.sign(date1.getTime() - date2.getTime());
if (difference === 1) {
console.log("Day is past");
} else if (difference === -1) {
console.log("Day is gone");
} else {
console.log("Day is here");
}
Output
Day is past
In this example, we're using the Math.sign()
method to determine whether date1
is after (difference === 1
) or before (difference === -1
) date2
.
Using toLocaleTimeString() Method
In JavaScript, the toLocaleTimeString()
method is used to get the time portion of a Date
object as a string, using the locale conventions of the execution environment.
When comparing two Date
objects using toLocaleTimeString()
, the strings obtained from each object's toLocaleTimeString()
method are compared according to a lexicographical (dictionary) order. This means that the comparison is done character by character, starting from the leftmost character in each string, until a difference is found.
For example, suppose we have two Date
objects, date1
and date2
, with the following values:
const date1 = new Date('2023-03-13T09:30:00');
const date2 = new Date('2023-03-13T10:15:00');
If we compare these two dates using toLocaleTimeString()
, like this:
const time1 = date1.toLocaleTimeString();
const time2 = date2.toLocaleTimeString();
if (time1 < time2) {
console.log('date1 is earlier than date2');
} else if (time1 > time2) {
console.log('date1 is later than date2');
} else {
console.log('date1 and date2 have the same time');
}
The output will be:
date1 is earlier than date2
This is because the time string obtained from date1
is '9:30:00 AM'
, while the time string obtained from date2
is '10:15:00 AM'
. When comparing these strings, the first character in '9'
is less than the first character in '10'
, so the comparison concludes that date1
is earlier than date2
.
Summary
Here's a summary of all the possible methods for comparing dates in JavaScript:
getTime()
: Returns the number of milliseconds since January 1, 1970, which can be used to compare two dates.<
,>
,<=
,>=
: Comparison operators can be used to compare twoDate
objects.valueOf()
: Returns the primitive value of aDate
object, which is the same as callinggetTime()
.toDateString()
: Returns a string representation of the date, without the time component.toISOString()
: Returns a string representation of the date in ISO format.toJSON()
: Returns a string representation of the date in JSON format.toLocaleDateString()
: Returns a string representation of the date in the local time zone, without the time component.toLocaleString()
: Returns a string representation of the date and time in the local time zone.toLocaleTimeString()
: Returns a string representation of the time in the local time zone, without the date component.toString()
: Returns a string representation of the date and time, including the time zone.UTC()
: Returns the number of milliseconds since January 1, 1970, in UTC time zone.toUTCString()
: Returns a string representation of the date and time in UTC time zone.
These methods can be used to compare dates in different formats and time zones, and to represent dates in various string formats.
References
Date - JavaScript | MDN (mozilla.org)
Math.sign() - JavaScript | MDN (mozilla.org)
Compare two dates with JavaScript - Stack Overflow