Skip to main content

Command Palette

Search for a command to run...

Handling Date and Time in JavaScript

Understanding Date Object of JavaScript

Updated
5 min read
Handling Date and Time in JavaScript

Handling date and time in JavaScript is notoriously tricky because of several design quirks and real-world complexities. Lets learn about the Date object from its construction, ways of formatting and calculations days , problems and its solution in this blog .

Ways of creating date in JavaScript

There are 4 ways of creating date.

  1. simple using new Date() . It gives current date and time based on your system timezone.

  2. using string like new Date("Mar3, 2026")

  3. using numbers arguments like new Date(2026, 2,3,10,20)

  4. using timestamps new Date(Date.now())

// 4 ways of creating date 

const now = new Date() ;
 console.log(now) ;  // Tue Mar 03 2026 11:03:05 GMT+0545 (Nepal Time)

// by string format 
 console.log(new Date("Mar 03, 2026")) ;
 console.log(new Date("2026-3-3")) ;
 console.log(new Date("feb 28, 2026")) ; // Sat Feb 28 2026 00:00:00 GMT+0545 (Nepal Time)
 console.log(new Date("feb 30, 2026")) ;  
// JS does auto correct the date 2 days in march
 // Mon Mar 02 2026 00:00:00 GMT+0545 (Nepal Time)
// console.log(new Date("3/3/2026")) ; // avoid using may behave differently in different browsers

// 3.by numbers arguments

console.log(new Date(0)) 
// this gives from where JS start to calculate timestamp 
// Thu Jan 01 1970 05:30:00 GMT+0530 (Nepal Time) 
// any invalid arguments give same data Jan 01, 1970

console.log(new Date(2026, 10, 29, 1, 10)) 
// year , month, day, hours, minutes, seconds
// month is 0 based 

// 4. by timestamps
// to get current timestamps calculate from Jan 01 , 1970
console.log(Date.now()) // 1772515848019
console.log(new Date(1772515848019))

Date Objects

There are many methods to get year, month, day, hours, minutes , seconds and many date related info .

// methods in Date

const now = new Date() ;
// gives current date and time 

// to get year use getFullYear
console.log(now.getFullYear()) // 2026
console.log(now.getMonth())  // 0 based 0 = Jan 
console.log(now.getDate())  // day of months
console.log(now.getDay())  // day of weeks 0 = sun
console.log(now.getHours())  // get hours
console.log(now.getMinutes())  // get minutes
console.log(now.getSeconds())  // get seconds
console.log(now.getTime())   // give timestamps
console.log(Date.now()) // fast way to get current timeStamps

Different Date Formatting Style

There are so many ways to show date format .

// formatting date
console.log(now) ; 
console.log(now.toString()) ;  
// it is defult way of showing date
// same as new Date()
// it gives long string with date and time 
// not ideal for UI 

console.log(now.toDateString()) ; 
// it gives only date
// Tue Mar 03 2026
// weekday month day year

console.log(now.toTimeString()) ; 
// it gives time  with time zone
// 12:11:58 GMT+0545 (Nepal Time)

console.log(now.toLocaleString());
// it is most useful 
// it gives date and time based on your locale like "en-us"
// 3/3/2026, 12:14:05 PM

console.log(now.toLocaleDateString());
// locale date 
// 3/3/2026

// similarlt to get locale time
console.log(now.toLocaleTimeString());
// 12:16:22 PM

console.log(now.toISOString())
// 2026-03-03T06:31:57.682Z

console.log(now.toUTCString())
// Tue, 03 Mar 2026 06:33:02 GMT

// custom ways of showing date

const month = String(now.getMonth()).padStart(2, "0");
const day = String(now.getDate()).padStart(2,"0") ;
const year = now.getFullYear()
// dd-mm-yyy
const formatted = `\({day}/\){month}/${year}`;
console.log(formatted) // 03/02/2026

// custom date 
console.log(now.toLocaleDateString()) 
// depends upon on your locale it gives date
// 3/3/2026

// now format it 
const formatDate = now.toLocaleDateString("en-US", {
    year:"numeric",
    month:"short",
    day:"2-digit"
})
console.log(formatDate)
// March 3, 2026
// month : "short" || "long" || "narrow"
// year, day : "numeric" , "2-digit"

// Date and Time Together 
console.log(now.toLocaleString())
// 3/3/2026, 12:32:48 PM

const formatDateAndTime = now.toLocaleString("en-US", {
    year:"numeric",
    month:"long",
    day:"2-digit",
    hour:"2-digit",
    minute:"2-digit",
    second:"2-digit"
})

console.log(formatDateAndTime)
// March 03, 2026 at 12:35 PM

// in YYYY-MM-DD API friendly 
console.log(now.toISOString())
// 2026-03-03T06:52:33.070Z
// now split on basis of T
console.log(now.toISOString().split("T")[0]) // 2026-03-03

// Time format 
const formatTime = now.toLocaleTimeString("en-US", {
    hour:"2-digit",
    minute:"2-digit",
    hour12 : false
})
console.log(formatTime)
// 12:40

// Locale is in format lie language-country
console.log(navigator.language) // to check locale on your system
// every locale has different style

console.log(now.toLocaleDateString("en-US")) // 3/3/2026
console.log(now.toLocaleDateString("en-GB")) // 03/03/2026
console.log(now.toLocaleDateString("de-DE")) // 3.3.2026

//Locale tells JavaScript how people in a specific country display dates, numbers, and text.

// JavaScript Date internally stores time in UTC.
// it is standard global time doesnot depend on yor country timezone
// your system clock offset

// MongoDB stores time in toISOString format 
// it ends with Z

Operation with Date

we can add and subtract date . The Date converts into timestamps when you convert date into numbers so It can be add and subtract.

// operations in date
const date1 = new Date();
const date2 = new Date("2026-03-04")
const diff = date2 - date1
console.log(diff) 
console.log(Math.round(diff/(1000 * 60*60*24))) // 1
console.log(date2 > date1) // true
console.log(date2 < date1) // false
// 60609462 
// it is in milliseconds
// convert into days by dividing with (1000 * 60*60*24)

Problems with Date handling in JavaScript

Date combines date, time , timezone, timestamp all in one object when you call new Date().

  • TimeZoe confusion

  • Month are 0 indexed

  • It is mutable when date is add or subtract it nutates original date variable.

  • Inconsistent in string parsing like new Date("03/04/2026") . what is this march 4 or April 3 ? Different browsers interpret this differently . only ISO format is safe .

  • DST (Daylight Saving Time) problems

Solutions

There are many packages to help us to deal with date and time if projects use complex date then some are

  • date-fns

  • dayjs

  • moment

  • for future date handling in JS Temporal objects used instead of date.

Conclusion

This is all about date and time in JavaScript. Developer need to go through a lot of works to handle through by date object in JavaScript. so we need to either handle manually or used third party npm packages .

Thanks for reading this article. I hope It will help you to understand Date object in JavaScript.