DATE AND TIME IN JAVASCRIPT
JavaScript has a built-in Date class for working with dates and time.
This note explains date and time in simple language.
You will learn:
- what the
Dateclass is - how to create a date
- how to set a specific date
- what Unix time is
- what
getTime()does - what
Date.now()does - how getters work
- how setters work
- common beginner mistakes
1. What is Date?
JavaScript has a built-in class called Date.
It helps you work with:
- current date
- current time
- future dates
- past dates
- timers
- clocks
- calendars
A Date object represents one specific moment in time.
Diagram 1. Main idea
Date object
-> one exact moment in time
A Date object is not just a day or a month. It stores a full moment in time.
2. Creating the current date and time
If you create a date with no arguments, JavaScript creates an object with the current date and time.
const date = new Date();
Example
const date = new Date();
console.log(date);
This gives you the current moment when the object was created.
If you print it, JavaScript shows a readable string version of the date.
Diagram 2. new Date() without arguments
new Date()
-> current date and time
3. Creating a date from a string
You can create a specific date by passing a string.
Example: only date
const date = new Date("2030-03-16");
console.log(date);
This creates a date for March 16, 2030.
Example: date and time
const date = new Date("2030-03-16T14:25:00");
console.log(date);
Here:
2030-03-16is the dateT14:25:00is the time
Diagram 3. String date format
"2030-03-16"
-> year-month-day
"2030-03-16T14:25:00"
-> year-month-day + time
The letter T separates the date part from the time part.
4. Flexible string formats
JavaScript allows several date string formats.
Examples
console.log(new Date("2030")); // year only
console.log(new Date("2030-03")); // year and month
console.log(new Date("2030-03-16")); // full date
console.log(new Date("2030-03-16T14:25:00")); // full date and time
You can pass:
- only year
- year and month
- full date
- full date with time
Diagram 4. Flexible formats
"2030"
-> year only
"2030-03"
-> year + month
"2030-03-16"
-> full date
"2030-03-16T14:25:00"
-> full date + time
5. Creating a date with numbers
Another way is to pass numbers directly into Date.
Syntax idea
new Date(year, month, day, hours, minutes, seconds, milliseconds)
Only the first three values are commonly used for a basic date.
Example
const date = new Date(2030, 2, 16, 14, 25, 0, 0);
console.log(date);
This creates:
- year:
2030 - month:
2 - day:
16 - hour:
14 - minute:
25
Important warning: month starts from 0
When using numbers, months start from 0.
0 = January
1 = February
2 = March
3 = April
...
11 = December
So in this example, new Date(2030, 2, 16) means March, not February.
Diagram 5. Numeric date creation
new Date(2030, 2, 16, 14, 25, 0, 0)
-> year = 2030
-> month = 2 = March
-> day = 16
-> time = 14:25:00
This is one of the most common beginner mistakes: numeric month starts from 0.
6. What is Unix time?
For computers, time is often stored as a number.
This number means how many milliseconds passed since midnight, January 1, 1970, UTC.
This is called Unix time.
Diagram 6. Unix time idea
January 1, 1970 00:00:00 UTC
-> start point
-> count milliseconds from there
Instead of storing time as text like "2030-03-16", the computer can store one number. That number represents one exact moment.
7. Creating a date from Unix milliseconds
If you pass one number into new Date(), JavaScript treats it as the number of milliseconds since January 1, 1970.
Example
console.log(new Date(0));
console.log(new Date(15000));
This means:
0means exactly the Unix start point15000means 15 seconds after that point
Diagram 7. Milliseconds to date
new Date(0)
-> Unix starting moment
new Date(15000)
-> 15 seconds after Unix starting moment
8. The getTime() method
Every Date object has a method called getTime().
It returns the numeric timestamp of that date.
Example
const date = new Date();
console.log(date.getTime());
The result is a number:
- milliseconds since January 1, 1970
- unique for that exact moment
Diagram 8. getTime()
Date object
-> getTime()
-> timestamp number
This is useful because numbers are easy to compare and calculate.
9. The Date.now() method
Sometimes you only need the current timestamp number.
Then you do not need to create a full Date object. You can use:
Date.now()
Example
const time = Date.now();
console.log(time);
This returns the current time in milliseconds as a number.
Diagram 9. new Date().getTime() vs Date.now()
new Date().getTime()
-> current timestamp
Date.now()
-> current timestamp
Both give the current timestamp, but Date.now() is shorter when you only need the number.
10. Why Date.now() is useful
Date.now() is very useful for:
- measuring how long code takes
- calculating time differences
- timers
- performance checks
Example
const startTime = Date.now();
for (let i = 0; i <= 100; i += 1) {
console.log(i);
}
const endTime = Date.now();
const elapsedTime = endTime - startTime;
console.log(`Elapsed time: ${elapsedTime} ms`);
What happens here?
- save time before code starts
- run the code
- save time after code ends
- subtract start from end
Diagram 10. Measuring time
startTime = Date.now()
-> run some code
-> endTime = Date.now()
-> elapsedTime = endTime - startTime
This is a very common pattern when you want to measure execution time.
11. Getters
A Date object has many methods for reading separate parts of the date.
These methods are called getters.
Example
const date = new Date("March 16, 2030 14:25:00");
console.log(date.getDate()); // 16
console.log(date.getDay()); // 6
console.log(date.getMonth()); // 2
console.log(date.getFullYear()); // 2030
console.log(date.getHours()); // 14
console.log(date.getMinutes()); // 25
console.log(date.getSeconds()); // 0
console.log(date.getMilliseconds()); // 0
Diagram 11. Main getters
getDate() -> day of month
getDay() -> day of week
getMonth() -> month
getFullYear() -> year
getHours() -> hours
getMinutes() -> minutes
getSeconds() -> seconds
getMilliseconds() -> milliseconds
12. Important difference: getDate() vs getDay()
This is one of the most common mistakes.
getDate()
Returns the day of the month.
getDay()
Returns the day of the week.
0 = Sunday
1 = Monday
2 = Tuesday
3 = Wednesday
4 = Thursday
5 = Friday
6 = Saturday
Diagram 12. getDate() vs getDay()
getDate()
-> day number in month
-> example: 16
getDay()
-> day number in week
-> example: 6 = Saturday
Easy rule:
getDate = month day
getDay = week day
13. Another important detail: getMonth()
getMonth() also starts counting months from 0.
0 = January
1 = February
2 = March
...
11 = December
Example
const date = new Date("March 16, 2030 14:25:00");
console.log(date.getMonth()); // 2
That means March.
Diagram 13. getMonth()
getMonth()
-> 0-based month number
So if you want a human-friendly month number, you often need:
date.getMonth() + 1
14. Setters
If getters read values, setters change values.
Setter methods start with set.
Example
const date = new Date("March 16, 2030 14:25:00");
date.setMinutes(50);
console.log(date);
date.setFullYear(2040);
console.log(date);
date.setMonth(4);
console.log(date);
What happens?
setMinutes(50)changes minutessetFullYear(2040)changes yearsetMonth(4)changes month
Diagram 14. Setter idea
Date object
-> setSomething(...)
-> date is changed
A setter changes the existing date object.
15. Common setters
Some useful setters are:
setDate()
setMonth()
setFullYear()
setHours()
setMinutes()
setSeconds()
setMilliseconds()
Diagram 15. Getter and setter relationship
Getter
-> read value
Setter
-> change value
Easy rule:
get = read
set = write
16. Example: changing one date step by step
const date = new Date("March 16, 2030 14:25:00");
console.log(date);
date.setMinutes(50);
console.log(date);
date.setFullYear(2040);
console.log(date);
date.setMonth(4);
console.log(date);
Diagram 16. Step-by-step changes
Start:
March 16, 2030 14:25:00
setMinutes(50)
-> March 16, 2030 14:50:00
setFullYear(2040)
-> March 16, 2040 14:50:00
setMonth(4)
-> May 16, 2040 14:50:00
Notice again: setMonth(4) means May because months start from 0.
17. Why Date is useful
The Date class is very useful for things like:
- clocks
- countdown timers
- calendars
- logs
- measuring time
- showing formatted date parts
- comparing moments in time
Diagram 17. Real uses of Date
Date
|
|- clocks
|- timers
|- calendars
|- logs
|- time measurement
`- comparisons
18. Common beginner mistakes
Mistake 1. Forgetting that numeric months start from 0
new Date(2030, 2, 16) // March, not February
Mistake 2. Confusing getDate() and getDay()
getDate()returns the day of monthgetDay()returns the day of week
Mistake 3. Thinking Date.now() returns an object
It returns a number, not a Date object.
Mistake 4. Forgetting that getMonth() is also 0-based
date.getMonth() // 0 to 11
Diagram 18. Common mistakes summary
Month number in Date = starts from 0
getDate() is not getDay()
Date.now() = number
getMonth() = 0 to 11
19. Easy memory rules
new Date() = current date and time
new Date("...") = date from string
new Date(number) = date from timestamp
getTime() = timestamp from Date object
Date.now() = current timestamp number
get = read part of date
set = change part of date
20. Quick summary
Dateis the built-in JavaScript class for working with date and time.new Date()without arguments creates the current date and time.- You can create a date from a string or from numbers.
- Numeric months start from
0. - Unix time counts milliseconds since January 1, 1970, UTC.
getTime()returns the timestamp of aDateobject.Date.now()returns the current timestamp as a number.- Getters read parts of a date.
- Setters change parts of a date.
getDate()andgetDay()are different.
21. Final conclusion
If you understand these ideas:
new Date()
date from string
date from numbers
Unix time
getTime()
Date.now()
getters
setters
then you already have a strong foundation for working with date and time in JavaScript.
This topic is very important because dates are used in almost every real project:
- user activity
- logs
- timers
- events
- calendars
- deadlines
- booking systems