DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 963,274 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for JavaScript and Dates
Abayomi Ogunnusi
Abayomi Ogunnusi

Posted on • Updated on

JavaScript and Dates

Let's have a look at a real-world example of how to interact with dates in JavaScript.

Setup
  • Create a project directory and initialize your project using npm init -y.
  • We will be working with a created index.js file.
  • Use 'node index.js' to run your code.

Get present date
const todayDate = new Date();
Enter fullscreen mode Exit fullscreen mode

Image description


Get month of the year, Year, Actual Day, Hour, Minute, milliseconds

const todayDate = new Date();
const today = todayDate.getDate();
const month = todayDate.getMonth() + 1; //JS months starts with index 0
const year = todayDate.getFullYear();
const day = todayDate.getDay();
const hour = todayDate.getHours();
const minute = todayDate.getMinutes();
const second = todayDate.getSeconds();
const millisecond = todayDate.getMilliseconds();

console.log('Milliseconds is :', millisecond);
console.log('Seconds is :', second);
console.log('Minutes is :', minute);
console.log('Hours is :', hour);
console.log('Month is: ', month);
console.log('Year is: ', year);
console.log('Today is: ', today);
Enter fullscreen mode Exit fullscreen mode

Result:
Image description


Date formatting
const todayDate = new Date();
const date = `${todayDate.getFullYear()}-${
  todayDate.getMonth() + 1
}-${todayDate.getDate()}`;

const time = `${todayDate.getHours()}:${todayDate.getMinutes()}:${todayDate.getSeconds()}`;
let dateAndTime = `${date}T${time}Z`;

console.log(date);
console.log(time);
console.log(dateAndTime);

Enter fullscreen mode Exit fullscreen mode

Result:

Image description


Get last year and last month

const date = new Date();
const lastMonth = new Date(date.setMonth(date.getMonth() - 1));

const dateYear = new Date();
const lastYear = new Date(dateYear.setFullYear(dateYear.getFullYear() - 1));
console.log({ lastMonth });
console.log({ lastYear });
Enter fullscreen mode Exit fullscreen mode

Setting new date 1

let myDate1 = new Date('2022-04-01');
let myDate2 = new Date('2022-06-02');
console.log(myDate1);
console.log(myDate2);
Enter fullscreen mode Exit fullscreen mode

Result:
Image description

Setting New Date 2
const date = new Date().toLocaleString('en-us', {
  month: 'long',
  day: 'numeric',
  year: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  hour12: false,
});
const customDate = new Date('2022-10-10').toLocaleString('en-us', {
  month: 'long',
  day: 'numeric',
  year: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
  hour12: false,
});

console.log(date);
console.log(customDate);
Enter fullscreen mode Exit fullscreen mode

Result:
Image description


Date Methods

let Lagos = new Date();
console.log({ toUTCString: Lagos.toUTCString() }); //Returns a date converted to UTC
console.log({ toLocaleString: Lagos.toLocaleString() }); //Converts a date to a string using the current locale
console.log({ toLocaleDateString: Lagos.toLocaleDateString() });
console.log({ toLocaleTimeString: Lagos.toLocaleTimeString() });
console.log({toLocaleString:Lagos.toLocaleString('en-US', { timeZone: 'Africa/Lagos' })});

Enter fullscreen mode Exit fullscreen mode

Result:
Image description


Get previous date

var date = new Date();

// date; //# => Fri Apr 01 2011 11:14:50 GMT+0200 (CEST)
console.log(date.getDate()); //"6"

date.setDate(date.getDate() - 1);
console.log(date);
Enter fullscreen mode Exit fullscreen mode

Discuss

Please share any JavaScript date methods, functions, or logic that developers would find useful in the comments area below.

Thank you for taking the time to read this.

Top comments (0)

Visualizing Promises and Async/Await 🀯

async await

☝️ Check out this all-time classic DEV post