Javascript Date

As you know, every website needs Date in its application. It's difficult to find a website, which does not use Date.

As every programming language, javasript has its Date too. It has its properties and methods.

Javascript Date()

Date() is a function, which lets you create date objects in javascript. When you call new Date(), it returns you a date object, with current date.

Syntax

new Date()       // used to create a simple date object with current date
new Date(milliseconds)      // used to create date with given milliseconds
new Date(dateString)      //used to create date with date string "mm/dd/yy"
new Date(year, month, day, hours, minutes, seconds, milliseconds) // create date with given properties

Let's make a simple example, to create the current date.

<!DOCTYPE html>
<html>
  <title>W3Docs.com</title>
  <body>

    <button onclick="createDate()">Click Me</button>
    <p>Date: <span id="element"></span></p>

    <script>
      function createDate() {
        document.getElementById("element").innerHTML = new Date();
      }
    </script>

  </body>
</html>

Let's create date using dateString.

<!DOCTYPE html>
<html>
  <title>W3Docs.com</title>
  <body>

    <button onclick="createDate()">Click Me</button>
    <p>Date: <span id="element"></span></p>

    <script>
      function createDate() {
        document.getElementById("element").innerHTML = new Date("October 1, 2014 19:20:00");
      }
    </script>

  </body>
</html>

Another example using number.

<!DOCTYPE html>
<html>
  <title>W3Docs.com</title>
  <body>

    <button onclick="createDate()">Click Me</button>
    <p>Date: <span id="element"></span></p>

    <script>
      function createDate() {
        document.getElementById("element").innerHTML = new Date(95478547757);
      }
    </script>

  </body>
</html>

Now we are going to create a Date, using the last way (syntax). One thing you have to remember, that Javascript date indexation starts from 0 to 11.

<!DOCTYPE html>
<html>
  <title>W3Docs.com</title>
  <body>

    <button onclick="createDate()">Click Me</button>
    <p>Date: <span id="element"></span></p>

    <script>
      function createDate() {
        document.getElementById("element").innerHTML = new Date(2014,10,11,12,24,30);
      }
    </script>

  </body>
</html>

Javascript Date() has its methods which let you get or set year, month, day, hour, minute...

Here is the list of Date's methods.

Method Description
getDate() Returns the day of the month (from 1-31)
getDay() Returns the day of the week (from 0-6)
getFullYear() Returns the year (four digits)
getHours() Returns the hour (from 0-23)
getMilliseconds() Returns the milliseconds (from 0-999)
getMinutes() Returns the minutes (from 0-59)
getMonth() Returns the month (from 0-11)
getSeconds() Returns the seconds (from 0-59)
getTime() Returns the number of milliseconds since midnight Jan 1, 1970
getTimezoneOffset() Returns the time difference between UTC time and local time, in minutes
getUTCDate() Returns the day of the month, according to universal time (from 1-31)
getUTCDay() Returns the day of the week, according to universal time (from 0-6)
getUTCFullYear() Returns the year, according to universal time (four digits)
getUTCHours() Returns the hour, according to universal time (from 0-23)
getUTCMilliseconds() Returns the milliseconds, according to universal time (from 0-999)
getUTCMinutes() Returns the minutes, according to universal time (from 0-59)
getUTCMonth() Returns the month, according to universal time (from 0-11)
getUTCSeconds() Returns the seconds, according to universal time (from 0-59)
getYear() Deprecated. Use the getFullYear() method instead
parse() Parses a date string and returns the number of milliseconds since January 1, 1970
setDate() Sets the day of the month of a date object
setFullYear() Sets the year (four digits) of a date object
setHours() Sets the hour of a date object
setMilliseconds() Sets the milliseconds of a date object
setMinutes() Set the minutes of a date object
setMonth() Sets the month of a date object
setSeconds() Sets the seconds of a date object
setTime() Sets a date to a specified number of milliseconds after/before January 1, 1970
setUTCDate() Sets the day of the month of a date object, according to universal time
setUTCFullYear() Sets the year of a date object, according to universal time (four digits)
setUTCHours() Sets the hour of a date object, according to universal time
setUTCMilliseconds() Sets the milliseconds of a date object, according to universal time
setUTCMinutes() Set the minutes of a date object, according to universal time
setUTCMonth() Sets the month of a date object, according to universal time
setUTCSeconds() Set the seconds of a date object, according to universal time
setYear() Deprecated. Use the setFullYear() method instead
toDateString() Converts the date portion of a Date object into a readable string
toGMTString() Deprecated. Use the toUTCString() method instead
toISOString() Returns the date as a string, using the ISO standard
toJSON() Returns the date as a string, formatted as a JSON date
toLocaleDateString() Returns the date portion of a Date object as a string, using locale conventions
toLocaleTimeString() Returns the time portion of a Date object as a string, using locale conventions
toLocaleString() Converts a Date object to a string, using locale conventions
toString() Converts a Date object to a string
toTimeString() Converts the time portion of a Date object to a string
toUTCString() Converts a Date object to a string, according to universal time
UTC() Returns the number of milliseconds in a date since midnight of January 1, 1970, according to UTC time
valueOf() Returns the primitive value of a Date object