JavaScript Dates

The JavaScript date object can be used to get year, month and day. You can display a timer on the webpage by the help of JavaScript date object.

You can use different Date constructors to create date object. It provides methods to get and set day, month, year, hour, minute and seconds.

The Date object lets you work with dates (years, months, days, minutes, seconds, milliseconds)

The Date object is a datatype built into the JavaScript language.

Creating Date Objects

The Date object lets us work with dates.

A date consists of a year, a month, a day, a minute, a second, and a millisecond.

Date objects are created with the new Date() constructor.

There are 4 ways of initiating a date:

new Date( )
new Date(milliseconds)
new Date(datestring)
new Date(year,month,date[,hour,minute,second,millisecond ])

Note: Paramters in the brackets are always optional

Here is the description of the parameters:

• No Argument: With no arguments, the Date( ) constructor creates a Date object set to the current date and time.
• milliseconds: When one numeric argument is passed, it is taken as the internal numeric representation of the date in milliseconds, as returned by the getTime( ) method. For example, passing the argument 5000 creates a date that represents five seconds past midnight on 1/1/70.
• datestring: When one string argument is passed, it is a string representation of a date, in the format accepted by the Date.parse( ) method.
• 7 agruments: To use the last form of constructor given above, Here is the description of each argument:
  • year: Integer value representing the year. For compatibility (in order to avoid the Y2K problem), you should always specify the year in full; use 1998, rather than 98.
  • month: Integer value representing the month, beginning with 0 for January to 11 for December.
  • date: Integer value representing the day of the month.
  • hour: Integer value representing the hour of the day (24-hour scale).
  • minute: Integer value representing the minute segment of a time reading.
  • second: Integer value representing the second segment of a time reading.
  • millisecond: Integer value representing the millisecond segment of a time reading.

Using new Date(), creates a new date object with the current date and time:

Example

Current Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date();  // Date Object
document.getElementById('demo').innerHTML = display;  
</script>  

Output

Current Date & Time:  

Using new Date(date string), creates a new date object from the specified date and time:

Example

Using String Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date("January 11, 2015 12:10:00"); 
document.getElementById('demo').innerHTML = display;  
</script>  

Output

Using String Date & Time:  

Using new Date(number), creates a new date object as zero time plus the number.

Example

Using Number Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date(999986999900); 
document.getElementById('demo').innerHTML = display;  
</script>  

Output

Using Number Date & Time:  

Using new Date(7 agruments), creates a new date object with the specified date and time:

Syntax

var x = new Date(year,month,date,hour,minute,second,millisecond);  // Date Object

Example

Using 7 agruments Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date(2015,7,11,12,13,30,0);  
document.getElementById('demo').innerHTML = display;  
</script>  

Output

Using 7 agruments Date & Time:  

Displaying Dates in Standard

The toUTCString() method converts a date to a UTC string (a date display standard).

Example

Current Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date();  
document.getElementById('demo').innerHTML = display.toUTCString();  
</script>  

Output

Current Date & Time:  

The toDateString() method converts a date to a more readable format.

Example

Current Date & Time: <span id="demo"></span> 

<script type="text/javascript">  
var display = new Date();  
document.getElementById('demo').innerHTML = display.toDateString();  
</script>  

Output

Current Date & Time:  

JavaScript Date Methods

The important methods of date object.

Example

Current Time: <span id="hms"></span> 

<script type="text/javascript"> 
var dispaly = new Date();  
var h = dispaly.getHours();  
var m = dispaly.getMinutes();  
var s = dispaly.getSeconds();  
document.getElementById('hms').innerHTML= h+":"+m+":"+s;  
</script>

Output

Current Time:  

JavaScript Digital Clock Example

There are two ways to set interval in JavaScript: by setTimeout() or setInterval() method.

Example

Current Time: <span id="view"></span> 
 
<script type="text/javascript">
window.onload = function(){getTime();}  
function getTime(){  
var display = new Date();  
var h = display.getHours();  
var m = display.getMinutes();  
var s = display.getSeconds();  
// add a zero in front of numbers<10  
m = checkTime(m);  
s = checkTime(s);  
document.getElementById('view').innerHTML=h+":"+m+":"+s;  
setTimeout(function(){getTime()},1000);  
}  
//setInterval("getTime()",1000);//another way  
function checkTime(i){  
if (i<10){  
  i="0" + i;  
 }  
return i;  
}  
</script>

Output

Current Time:  

Share this article on