How to Compare Two Dates Using 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

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:

<scripttype="text/javascript"language="javascript">

 

   function CompareDate() {

       //Note: 00 is month i.e. January

       var dateOne = new Date(2010, 00, 15); //Year, Month, Date

       var dateTwo = new Date(2011, 00, 15); //Year, Month, Date

       if (dateOne > dateTwo) {

            alert("Date One is greather then Date Two.");

        }else {

            alert("Date Two is greather then Date One.");

        }

    }

 

    CompareDate();

</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:

<scripttype="text/javascript"language="javascript">

 

   function CompareDate() {

       //            new Date(Year, Month, Date, Hr, Min, Sec);

       var dateOne = new Date(2012, 04, 20, 14, 55, 59);

       var dateTwo = new Date(2012, 04, 20, 12, 10, 20);

        //Note: 04 is month i.e. May

       if (dateOne > dateTwo) {

            alert("Date One is greather then Date Two.");

        }else {

            alert("Date Two is greather then Date One.");

        }

    }

 

    CompareDate();

</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:

<scripttype="text/javascript"language="javascript">

 

   function CompareDate() {

       var todayDate = new Date(); //Today Date

       var dateOne = new Date(2010, 11, 25);

       if (todayDate > dateOne) {

            alert("Today Date is greather then Date One.");

        }else {

            alert("Today Date is greather then Date One.");

        }

    }

 

    CompareDate();

</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.