Have a Date with Javascript

Using the Javascript Date Object

© Mark Alexander Bain

Dec 22, 2008
The Javascript Date Object, Mark Alexander Bain
If a web page programmer uses Javascript then dates are easy to use and manipulate - it's just a matter of creating a Javascript date object.

When it comes to working with dates programmers have an easy job if they are working with Javascript - and that's because Javascript has its own date object - an object that enables the computer programmer to:

  • create dates
  • add and subtract dates
  • format dates

The first, and most obvious, date to create, is the current date.

Creating New Dates with Javascript

When a new date object is created with Javascript it is automatically set to the current date and time, for example:

var today = new Date();
document.write(today);

for which the output will be something like:

Mon Dec 22 01:27:11 UTC 2008

Other dates can also be set just as easily - and Javascript is very lenient when the programmer comes to this - both of the following will work just as well:

var christmas_day = new Date("25 December 2008");
var new_years_day = new Date(2009, 0, 1);

so that:

document.write(christmas_day + " ");
document.write(new_years_day + " ");

will produce:

Thu Dec 25 00:00:00 UTC 2008
Thu Jan 1 00:00:00 UTC 2009

And the Javascript date objects are equally as easy to use when the programmer starts to manipulate the dates.

Adding Dates with Javascript

Javascript date object has a few methods that can be used for the addition of dates, for example getDate and setDate:

var tomorrow = new Date ();
document.write(tomorrow + " ");
tomorrow.setDate (tomorrow.getDate() + 31)
document.write(tomorrow + " ");

Here 31 is added to the current date to give:

Mon Dec 22 09:45:42 UTC 2008
Thu Jan 22 09:45:42 UTC 2009

However, subtracting one date from another with Javascript is slightly different:

Subtracting One Date from Another with Javascript

The actual process of find the difference between dates is very simple:

var diff = christmas_day - day;

It's just the answer that's rather surprising:

245450000

This is because the answer is given in milliseconds (and it's worth noting a this point that each date is actually stored as the number of milliseconds since midnight on the 2nd January 1970). Therefore the programmer will need to convert the value into something recognizable, for example:

var day_diff = parseInt(diff/(1000*60*60*24));

This code snippet enables the programmer to get the results of 2 days.

Formatting Dates with Javascript

The above examples have shown that it's easy to display the date but that the format is not particularly attractive, however the examples have also shown that it is possible to extract individual part of the day - in addition to the getDate method (which obtains the day of the month) there is also:

  • getFullYear - returns the year in 4 figure format
  • getMonth - returns the month number (starting with 0=January to 11=December

This means, of course, that a little more processing is required to format the date correctly:

month = new Array("January", "February","March", "April", "May", "June",
"July", "August", "September", "October", "November", "December");
document.write (month[day.getMonth()]);

Now the correct month name will be displayed, or the correct month number can be used:

document.write (day.getFullYear() + "/"
+ (day.getMonth() + 1) + "/"
+ (day.getDate())
);

The above code will return 2008/12/22 on the 22nd December 2008.

Summary

Javascript has it's own date object which can be created by using the new method and will, by default, be set to the current date and time. The dates can then be added to (by using the get... and set... methods) and one date can be subtracted from another (for which the result will be in milliseconds). Finally the individual elements of the date of the date by using the get... methods.


The copyright of the article Have a Date with Javascript in Javascript/Java Programming is owned by Mark Alexander Bain. Permission to republish Have a Date with Javascript in print or online must be granted by the author in writing.


The Javascript Date Object, Mark Alexander Bain
       


Post this Article to facebook Add this Article to del.icio.us! Digg this Article furl this Article Add this Article to Reddit Add this Article to Technorati Add this Article to Newsvine Add this Article to Windows Live Add this Article to Yahoo Add this Article to StumbleUpon Add this Article to BlinkLists Add this Article to Spurl Add this Article to Google Add this Article to Ask Add this Article to Squidoo

Comments
Jan 15, 2009 6:38 AM
Guest :
Thanks a ton for this tip !!
1 Comment: