An introduction to dates and times in JavaScript

Working with dates is an important aspect of programming. The built-in date object is used to work with dates and times in JavaScript. The different methods of the date object make it much easier when working with dates and times.

In this article, you will learn everything you need to know about using dates in JavaScript. So, without further ado, let’s get in.

How to create date objects

You can create a date object in JavaScript using the following four methods:

1. new date ()

the new date () the constructor creates a date object with the current date and time.

let d = new Date();
console.log(d);

To go out:

Mon Jan 03 2022 20:27:58 GMT+0530 (India Standard Time)

2.new date (date string)

the new date (date string) The constructor creates a date object from a date string.

let d = new Date("2022-01-01");
console.log(d);

To go out:

Sat Jan 01 2022 05:30:00 GMT+0530 (India Standard Time)

3.new date (milliseconds)

the new date (milliseconds) The constructor creates a date object by appending the milliseconds to the zero hour. The parameter represents the elapsed time in milliseconds since January 1, 1970 UTC.

let d1 = new Date(0);
console.log(d1);
let d2 = new Date(973436457364);
console.log(d2);

To go out:

Thu Jan 01 1970 05:30:00 GMT+0530 (India Standard Time)
Sun Nov 05 2000 20:30:57 GMT+0530 (India Standard Time)

VIDEO OF THE DAY MAKEUSE

4.new date (year, month, day, hours, minutes, seconds, milliseconds)

the new date (year, month, day, hours, minutes, seconds, milliseconds) The constructor creates a date object with a specified date and time. The seven parameters specify the year, month, day, hours, minutes, seconds, and milliseconds, respectively.

let d = new Date(2020, 10, 11, 15, 29, 46, 0);
console.log(d);

To go out:

Wed Nov 11 2020 15:29:46 GMT+0530 (India Standard Time)

You can also create a date object with six, four, three, or two parameters.

a) The six parameters specify the year, month, day, hour, minute and second.

b) The five parameters specify the year, month, day, hour and minute.

c) The four parameters specify the year, month, day and time.

d) The three parameters specify the year, month and day.

e) The two parameters specify the year and the month.

To note:

  • JavaScript counts the months from 0 to 11, that is, January is represented by 0 and December is represented by 11.
  • If you specify out-of-range values ​​in the Date object, it won’t generate an error instead, it corrects itself automatically.
// March does not have 40 days, the overflow is auto-corrected
let d = new Date(2020, 2, 40);
console.log(d);

To go out:

Thu Apr 09 2020 00:00:00 GMT+0530 (India Standard Time)

Methods of getting the JavaScript date

You can use the following methods to get information from a date object.

1. getFullYear ()

This method returns the year as a four-digit number (yyyy) according to local time.

let d = new Date();
console.log(d.getFullYear());


To go out:

2022

2. getMonth ()

This method returns the month as a number (0-11) according to local time.

let d = new Date();
console.log(d.getMonth());

To go out:

0

3. getDate ()

This method returns the day as a number (1-31) according to local time.

let d = new Date();
console.log(d.getDate());

To go out:

3

Related: An Introduction to Data Types in JavaScript

4. getHours ()

This method returns the hour (0-23) according to local time.

let d = new Date();
console.log(d.getHours());

To go out:

22

5. getMinutes ()

This method returns the minute (0-59) according to local time.

let d = new Date();
console.log(d.getMinutes());

To go out:

40

6. getSeconds ()

This method returns the second (0-59) according to local time.

let d = new Date();
console.log(d.getSeconds());

To go out:

30

7. getMilliseconds ()

This method returns the millisecond (0-999) based on local time.

let d = new Date();
console.log(d.getMilliseconds());

To go out:

55

Related: One-Liners JavaScript You Need To Know

8. getTime ()

This method returns the time in milliseconds since January 1, 1970.

let d = new Date();
console.log(d.getTime());

To go out:

1641230088884

9. getDay ()

This method returns the day of the week as a number (0-6) according to local time.

let d = new Date();
console.log(d.getDay());

To go out:

1

To note: If you want to work with UTC dates, you can use the following date methods: getUTCDate (), getUTCDay (), getUTCFullYear (), getUTCHours (), getUTCMilliseconds (), getUTCMinutes (), getUTCMois (), and getUTCSeconds ().

JavaScript date setting methods

You can use the following methods to define part of a date object.

1.setDate ()

This method sets the day as a number (1-31) for a specified date based on local time.

let d = new Date();
d.setDate(20);
console.log(d);

To go out:

Thu Jan 20 2022 22:58:59 GMT+0530 (India Standard Time)

Related: JavaScript Math Methods You Should Master Today

2.setFullYear ()

This method sets the year to a specified date based on local time.

let d = new Date();
d.setFullYear(2016);
console.log(d);

To go out:

Sun Jan 03 2016 23:00:41 GMT+0530 (India Standard Time)

3.setHours ()

This method sets the hour (0-23) of a specified date based on local time.

let d = new Date();
d.setHours(15);
console.log(d);

To go out:

Mon Jan 03 2022 15:02:01 GMT+0530 (India Standard Time)

Related: How to Create a Simple Calculator Using HTML, CSS, and JavaScript

4.setMilliseconds ()

This method sets the milliseconds (0-999) for a specified date based on local time.

let d = new Date();
d.setMilliseconds(548);
console.log(d);

To go out:

Mon Jan 03 2022 23:04:13 GMT+0530 (India Standard Time)

Likewise, you can use the setMinutes (), setMonth (), and setSeconds () methods for setting minutes (0-59), month (0-11) and seconds (0-59) respectively for a specified date according to local time.

Example of current time in JavaScript

A simple example to print the current system time:





Current Time





If you’d like to check out the full source code used in this article, here’s the GitHub repository.

Develop projects using JavaScript date concepts

You will encounter many instances of JavaScript dates when working on real applications. If you want to start with a simple project and gain some hands-on experience, you can develop a digital clock using HTML, CSS, and JavaScript. In addition to dates, you will also learn some important JavaScript concepts such as using variables, using functions, accessing and adding properties to the DOM, and more.


Digital clock display on mac
How to Create a Digital Clock Using HTML, CSS, and JavaScript

Do you code until the chirping of birds informs you that it is morning? Keep track of time with this personalized clock.

Read more


About the Author


Source link

Comments are closed.