Part 3.8Dates in JavaScript

Dates in JavaScript are formed with the Date object.

Working with dates

To generate a date based on the current time, a Date object is simply created with no arguments:

alert(new Date());

Notice that the time created is the current time. To change this to another time, such as a time in the future or past an argument must be given:

var date = "July 13, 1991 10:31:00";
alert(new Date(date));

In the previous example, a date; the 13th of July 1991 at 10:31, is being put into the Date object as a string. The string is then transformed into an actual Date object.

An alternative method of creating the previous date is to break it down:

var date = "July 13, 1991 10:31:00";
alert(new Date(1991, 6, 13, 10, 31, 00, 00));

Creating dates using milliseconds

All dates begin on January the 1st 1970 at 00:00:00 UTC.

With the Date object it is possible to specific a number of milliseconds from that date. For instance, to get the second of January 1970, simply multiply 1000 (milliseconds) by 60 (seconds) by 60 (minutes) by 24 (hours) to get the number of milliseconds in a day:

var date = 60 * 60 * 24 * 1000; //86400000
alert(new Date(date));

JavaScript adds the number of milliseconds specified to January 1st 1970 00:00:00 UTC.

Date object methods

The Date object provides multiple methods for manipulating the date. For example, it is incredibly easy to obtain the number of milliseconds through the second that the date is:

var date = new Date();
alert(date.getMilliseconds());

The above method will simply return the milliseconds into the current second. It can shorthanded with the following:

alert((new Date()).getMilliseconds());

There are more methods available in this object such as:

• getSeconds();
• getDate();
• getDay();
• getFullYear();
• getTime();
• getTimezoneOffset();
• getUTCSeconds();
• toDateString();
• toGMTString();

Of course, there are also setter methods on the Date object too:

• setSeconds(seconds);
• setMinutes(minutes);
• setYear(years);

Messing with dates

The dates used in JavaScript do not come from a server. They come from the client's local machine. For this reason it's very easy to tamper with the date. In fact all that the client needs to do to change the date is change the system date:

After changing the date or time the JavaScript object will return the time as reported by the operating system.

Timeouts and intervals

Since JavaScript works in real-time it is often necessary to work to specific times. This is achieved using timeouts and intervals.

A timeout is a wait for a certain time before something happens just once. An interval occurs over and over again.

There are two methods that do this in JavaScript, namely: setTimeout() and setInterval().

The following code example will start a clock that will update automatically:

function getTime() {
  var d = new Date();
  var s = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
  console.log(s);
}

//How long to wait before starting the interval for precision
var startIn = 1000 - (new Date()).getMilliseconds();

//Now set a timeout until then begin the interval
setTimeout(function(){
  setInterval(function(){
    //Update using the getTime() method
    getTime();
  }, 1000);
}, startIn);