JavaScript Date And Time Formats

Javascript date and time formats are the most searched topics. we will explain the widely used formats here.

The Javascript date object lets us work with dates and times. The Date is the built-in object. it enables us to create, store and modify date and time formats

How to create Date objects.

To create a new Date object call the new Date() constructor. There are basically 4 ways to create date objects.

//Example
// JavaScript Date And Time Formats

var date1 = new Date();
var date2 = new Date(milliseconds);
var date3 = new Date(dateString);
var date4 = new Date(year, month, day, hours, minutes, seconds, milliseconds);

//

new Date();

The new Date() creates a new date object with the current date and time. It takes no arguments.

// Example , new Date();
// JavaScript Date And Time Formats

let date = new Date();
console.log( date ); // shows current date/time

//output: Wed Nov 25 2020 18:13:15 GMT+0500 

new Date(milliseconds);

When you pass milliseconds as timestamp then the date() object will be created. Its stores date since the beginning of 1970 (year).

The value of milliseconds could be negative or positive.

The negative value will generate the date before 1970 whereas the positive value of milliseconds adds the date object with 1970.

Zero value of milliseconds means 01 January 1970.

24 hours is 86 400 000 milliseconds.

// Examples
// JavaScript Date And Time Formats

// 0 means 
let Jan_01_1970 = new Date(0);
console.log(Jan_01_1970);
// output: Thu Jan 01 1970 05:00:00 GMT+0500



// now add 24 hours to 'Jan 01 1970' (positive value of miliseconds)
let ms_in_24hours = 24 * 3600 * 1000;
let Jan_02_1970 = new Date(ms_in_24hours);
console.log( Jan_02_1970 );
//output: Fri Jan 02 1970 05:00:00 GMT+0500



// now subtract 24 hours from 'Jan 01 1970' (negative value of miliseconds)
let Dec_31_1969 = new Date( - ms_in_24hours );
console.log( Dec_31_1969 );
//output: Wed Dec 31 1969 05:00:00 GMT+0500


//

new Date(datestring);

The datestring is a single argument. It is a string format of date e.g ‘2020-01-11‘.

This is similar to Date.parse();

There are three types of date input formats in JavaScript:

TypeExample
ISO Date“2015-03-25” (The International Standard)
Short Date“03/25/2015”
Long Date“Mar 25 2015” or “25 Mar 2015”
JavaScript Date Input

Here are examples of some JavaScript Date And Time Formats

//Js Date formats
// JavaScript Date And Time Formats

// complete date
let date = new Date("2020-01-01");
// or
var date = new Date("01-01-2020"); // some browsers may return NaN for this format
//or
var date = new Date("2020/01/01"); // some browsers may return NaN for this format too.

// ISO Dates (Year and Month)
// This can be written without specifying the day (YYYY-MM),
let date = new Date("2020-01");


// ISO Dates (Only Year),
// without month and day (YYYY),
let date = new Date("2020");

// ISO Dates (Date-Time) 
// with added hours, minutes, and seconds (YYYY-MM-DDTHH:MM:SSZ),
let date = new Date("2020-03-25T12:00:00Z");

In the above example JavaScript Date And Time Formats is separated with a capital T.

capital Z defines UTC time. You can remove the Z and add +HH: MM or –HH: MM to modify the time relative to UTC.

// Example 

var date = new Date("2010-03-25T12:00:00-06:30");

//

Note: UTC (Universal Time Coordinated) is the same as GMT (Greenwich Mean Time).

Removing the capital T or capital Z in a date-time string can give different outputs in different browsers.

JS Long dates are expressed with the “MMM DD YYYY” syntax.

//Example

// Js long dates
// syntax: "MMM DD YYYY",
let date = new Date("Mar 01 2020");
// or
// you can write month and day in any order.
let  date = new Date("01 Mar 2020");
// or
// month with full spelling
let date = new Date("March 01 2020")
// output, something like: Sun Mar 01 2020 00:00:00 GMT+0500

// Commas are ignored. 
// Names are case insensitive,
let date = new Date("JANUARY, 01, 2020");

//

new Date(year, month, day, hours, minutes, seconds, milliseconds);

This way you need to specify up to 7 arguments in the specified order.

You can’t provide only one parameter because it means milliseconds, as we stated above.

for example,

//Examples

new Date(year, month);

new Date(year, month, day);

new Date(year, month, day, hour);

new Date(year, month, day, hour, minutes);

new Date(year, month, day, hour, minutes, seconds);

new Date(year, month, day, hour, minutes, seconds, miliseconds);

//

Note: JavaScript counts months from 0 to 11. It means January is 0 and December is 11.

// example

// december 2020
let date = new Date(2020, 11);

//

JavaScript Date parse() Method in JavaScript Date And Time Formats

The date.parse() method returns a number of milliseconds that have passed since January 1, 1970, till the date we provide.

This syntax is Date.parse(datestring);

datestring: Represents the date as a string. If we provide the wrong datestring then the output will be NaN.

// Example

// if date is correct
var date = Date.parse("March 05, 2021");
console.log(date);
//output: 1614884400000


// if we provide wrong date (eg 60th march)
var date = Date.parse("March 60, 2021");
console.log(date);
// output: NaN

//
JavaScript Date And Time Formats
JavaScript Date And Time Formats

Get Year, Month, Date, Hour, and so on.. from date object.

There are methods to extract the current date, year, month and so on.

//Example

// Current Year
let date = new Date();
let current_year = date.getFullYear();
console.log(current_year);
// output: This will display current year


// Current Year
let current_month = date.getMonth() // Get the month, from 0 to 11. JS Count months from 0
// 0 => Jan
// 1 => Feb
// ......


// Similarly you can get date, seconds miliseconds etc.
let current_date = getDate(); 
// Get the day of month, from 1 to 31, the output will be an integer.
 
getDay();

getHours();

getMinutes();
 
getSeconds();
 
getMilliseconds();

// ......


//

Learn Via Videos

Here is a YouTube video to get started with JavaScript Date And Time Formats in JavaScript.

References

https://www.w3schools.com/js/js_date_formats.asp

https://javascript.info/date

https://www.educba.com/javascript-date-formats/

Similar Posts