How to Compare Two Dates In JavaScript

In this article, you will learn how to compare two dates in JavaScript. The code also compares two date and times in JavaScript.

I have encountered many confused developers attempting to compare two dates using JavaScript. There are many methods or algorithms for comparing dates but I am showing the simplest ways to compare dates as well as times using JavaScript.
 
This article will help you to resolve following problems:
  1. Compare two dates with time.
  2. Compare today date with any another date.
  3. Compare past and future dates with given date.

Create a Date Object

 
The following describes creation of Date objects:
  1. First we need to create a date object.
  2. The Date object is used to work with dates and times.
  3. Date objects are created with the Date() constructor.
  4. There are four ways of instantiating a date object:

    • new Date() //This will return current date and time.
    • new Date(milliseconds)
    • new Date(dateString)
    • new Date(year, month, day, hours, minutes, seconds, milliseconds)

  5. Here are a few examples of instantiating a date:
     
    • var today = new Date() //Current date
    •  var anotherDate = new Date("March 01, 2000 20:50:10")
    • var anotherDate = new Date(2000,03,01) 
    • var anotherDate = new Date(2000,03,01,20,50,10)
     
  6. Note: Here the month parameter will start from 0 to 11.

Comparing dates in JavaScript

 
The following describes how to compare two dates:
  1. I have two dates. Date one is 15-01-2010 and another date is 15-01-2011.
  2. I compare these two dates using the following JavaScript code
    1. <script type="text/javascript"language="javascript">  
    2.    function CompareDate() {  
    3.        //Note: 00 is month i.e. January  
    4.        var dateOne = new Date(2010, 00, 15); //Year, Month, Date  
    5.        var dateTwo = new Date(2011, 00, 15); //Year, Month, Date  
    6.        if (dateOne > dateTwo) {  
    7.             alert("Date One is greater than Date Two.");  
    8.         }else {  
    9.             alert("Date Two is greater than Date One.");  
    10.         }  
    11.     }  
    12.     CompareDate();  
    13. </script>
Output
 
 
 
Comparing dates with time
 
The following describes how to compare dates with times:
  1. Here I will compare two dates with their times.
  2. I have two dates
    - Date One: 20-05-2012 14:55:59
    - Date Two: 20-05-2012 12:10:20
  3. The following JavaScript code will compare these dates with their times:
    1. <script type="text/javascript"language="javascript">  
    2.    function CompareDate() {  
    3.        //            new Date(Year, Month, Date, Hr, Min, Sec);  
    4.        var dateOne = new Date(2012, 04, 20, 14, 55, 59);  
    5.        var dateTwo = new Date(2012, 04, 20, 12, 10, 20);  
    6.         //Note: 04 is month i.e. May  
    7.        if (dateOne > dateTwo) {  
    8.             alert("Date One is greater than Date Two.");  
    9.         }else {  
    10.             alert("Date Two is greater than Date One.");  
    11.         }  
    12.     }  
    13.     CompareDate();  
    14. </script>  
Output
 
 
Comparing today's date with another date
 
The following describes how to compare today's date with another date:
  1. The following code will compare today's date with the given date.
  2. The given date is 25-12-2010. This date will be compared with today's date using the following code:
    1. <script type="text/javascript"language="javascript">  
    2.    function CompareDate() {  
    3.        var todayDate = new Date(); //Today Date  
    4.        var dateOne = new Date(2010, 11, 25);  
    5.        if (todayDate > dateOne) {  
    6.             alert("Today Date is greater than Date One.");  
    7.         }else {  
    8.             alert("Today Date is greater than Date One.");  
    9.         }  
    10.     }  
    11.     CompareDate();  
    12. </script>
Output
 
 
Some useful methods of Date Object:
  • getDate: Returns the day of the month (1-31) for the specified date according to local time.
  • getDay: Returns the day of the week (0-6) for the specified date according to local time.
  • getFullYear: Returns the year (4 digits for 4-digit years) of the specified date according to local time.
  • getHours: Returns the hour (0-23) in the specified date according to local time.
  • getMilliseconds: Returns the milliseconds (0-999) in the specified date according to local time.
  • getMinutes: Returns the minutes (0-59) in the specified date according to local time.
  • getMonth: Returns the month (0-11) in the specified date according to local time.
  • getSeconds: Returns the seconds (0-59) in the specified date according to local time.
  • getTime: Returns the numeric value of the specified date as the number of milliseconds since January 1, 1970, 00:00:00 UTC (negative for prior times).
  • getTimezoneOffset: Returns the time-zone offset in minutes for the current locale.
  • getUTCDate: Returns the day (date) of the month (1-31) in the specified date according to universal time.
  • getUTCDay: Returns the day of the week (0-6) in the specified date according to universal time.
  • getUTCFullYear: Returns the year (4 digits for 4-digit years) in the specified date according to universal time.
  • getUTCHours: Returns the hours (0-23) in the specified date according to universal time.
  • getUTCMilliseconds: Returns the milliseconds (0-999) in the specified date according to universal time.
  • getUTCMinutes: Returns the minutes (0-59) in the specified date according to universal time.
  • getUTCMonth: Returns the month (0-11) in the specified date according to universal time.
  • getUTCSeconds: Returns the seconds (0-59) in the specified date according to universal time.
  • getYear: Returns the year (usually 2-3 digits) in the specified date according to local time. Use getFullYear instead.
  • setDate: Sets the day of the month (1-31) for a specified date according to local time.
  • setFullYear: Sets the full year (4 digits for 4-digit years) for a specified date according to local time.
  • setHours: Sets the hours (0-23) for a specified date according to local time.
  • setMilliseconds: Sets the milliseconds (0-999) for a specified date according to local time.
  • setMinutes: Sets the minutes (0-59) for a specified date according to local time.
  • setMonth: Sets the month (0-11) for a specified date according to local time.
  • setSeconds: Sets the seconds (0-59) for a specified date according to local time.
  • setTime: Sets the Date object to the time represented by a number of milliseconds since January 1, 1970, 00:00:00 UTC, allowing for negative numbers for times prior.
  • setUTCDate: Sets the day of the month (1-31) for a specified date according to universal time.
  • setUTCFullYear: Sets the full year (4 digits for 4-digit years) for a specified date according to universal time.
  • setUTCHours: Sets the hour (0-23) for a specified date according to universal time.
  • setUTCMilliseconds: Sets the milliseconds (0-999) for a specified date according to universal time.
  • setUTCMinutes: Sets the minutes (0-59) for a specified date according to universal time.
  • setUTCMonth: Sets the month (0-11) for a specified date according to universal time.
  • setUTCSeconds: Sets the seconds (0-59) for a specified date according to universal time.
  • setYear: Sets the year (usually 2-3 digits) for a specified date according to local time. Use setFullYear instead.
  • toDateString: Returns the "date" portion of the Date as a human-readable string.
I hope you will enjoy this article. Please provide your valuable suggestions.