JavaScript for Beginners

Day 12 : Date Object

By Basavalingam

Course Contents

1. Introduction to JavaScript
1. What is Javascript?
2. History of JavaScript
3. What can you do with it?
4. Where does Javascript code run?
5. JavaScript in action!
6. My first Javascript (Internal)!
7. External JavaScript
8. JavaScript Output
9. Setting up Development Environment
10. NodeJS in action!
2. JavaScript Variables
3. Statements and Code Blocks
4. Javascript Operators and Expressions
5. JavaScript Objects and Methods

• JavaScript Collection Objects
• Arrays
• Sets
• Maps and
• Objects
• Loops
• Conditional Statements
• Control Statements
• JavaScript Functions
• JavaScript Events
• JavaScript Modules
• JavaScript Errors
• Math Object
• Date Object

​

Day 12 : Date Object

Date

const d = new Date();

console.log(d);

===

​

const d = new Date("2022-03-25");

console.log(d);

​

Date objects are static. The "clock" is not "running".

The computer clock is ticking, date objects are not.

By default, JavaScript will use the browser's time zone and display a date as a full text string:

Sun May 07 2023 14:42:11 GMT+0530 (India Standard Time)

​

​

Creating Date Objects…

Date objects are created with the new Date() constructor.

There are 9 ways to create a new date objects as shown in next two slides.

new Date(year, month, ...) creates a date object with a specified date and time.

7 numbers specify year, month, day, hour, minute, second, and millisecond (in that order):

const d = new Date(2018, 11, 24, 10, 33, 30, 0);

If you supply only one parameter it will be treated as milliseconds

​

​

JavaScript counts months from 0 to 11:

January = 0.

December = 11

Specifying a month higher than 11, will not result in an error but add the overflow to the next year.

Specifying a day, hour, minute and second higher than max, will not result in an error but add the overflow to the next month,day, hour and minute respectively.

​

​

​

The 9 ways of Creating Date Objects…

Creating Date Objects

Dates as Milliseconds

​

JavaScript stores dates as number of milliseconds since January 01, 1970.

Zero time is January 01, 1970 00:00:00 UTC.

One day (24 hours) is 86 400 000 milliseconds.

Now the time is: 1683451228689 milliseconds past January 01, 1970

​

const d = new Date(0);

console.log(d);

​

const d = new Date(24 * 60 * 60 * 1000);

console.log(d);

// or

const d = new Date(86400000);

console.log(d);

​

const d = new Date(-2*86400000);

console.log(d);

​

const d = new Date(100000000000);

console.log(d);

​

const d = new Date(-100000000000);

console.log(d);

​

​

​

​

Full form of UTC is Coordinated Universal Time or Universal Time Coordinated (UTC)

UTC and GMT are one and the same.

IST Indian time zone offset is UTC+05:30

JavaScript Date Input

ISO Date → "2015-03-25" (The International Standard)

Short Date → "03/25/2015"

Long Date → "Mar 25 2015" or "25 Mar 2015"

​

The ISO format follows a strict standard in JavaScript.

The other formats are not so well defined and might be browser specific

​

​

​

​

​

JavaScript ISO Dates

​

ISO 8601 is the international standard for the representation of dates and times.

The ISO 8601 syntax (YYYY-MM-DD) is also the preferred JavaScript date format

const d = new Date("2015-03-25");

console.log(d)

​

const d = new Date("2015-03");

const d = new Date("2015");

const d = new Date("2015-03-25T12:00:00Z");

const d = new Date("2015-03-25T12:00:00-06:30");

const d = new Date("2015-03-25T12:00:00+06:30");

Date and time is separated with a capital T.

UTC time is defined with a capital letter Z.

If you want to modify the time relative to UTC, remove the Z and add +HH:MM or -HH:MM instead.

​

​

​

​

JavaScript Short Dates

Short dates are written with an "MM/DD/YYYY" syntax like this:

const d = new Date("03/25/2015");

console.log(d)

​

In some browsers, months or days with no leading zeroes may produce an error.

The behavior of "YYYY/MM/DD" or "DD-MM-YYYY" is undefined.

Some browsers will try to guess the format. Some will return NaN.

const d = new Date("2015/03/25");

const d = new Date("25-03-2015");

JavaScript Long Dates

Long dates are most often written with a "MMM DD YYYY" syntax like this

const d = new Date("Mar 25 2015");

console.log(d)

​

const d = new Date("25 Mar 2015");

const d = new Date("January 25 2015");

const d = new Date("Jan 25 2015");

const d = new Date("JANUARY, 25, 2015");

​

Month and day can be in any order:

month can be written in full (January), or abbreviated (Jan):

Commas are ignored. Names are case insensitive

​

Date Input - Parsing Dates

​

If you have a valid date string, you can use the Date.parse() method to convert it to milliseconds.

Date.parse() returns the number of milliseconds between the date and January 1, 1970

​

let msec = Date.parse("March 21, 2012")

console.log(msec)

​

You can then use the number of milliseconds to convert it to a date object:

let msec = Date.parse("March 21, 2012")

const d = new Date(msec)

console.log(d)

Date Methods

Date methods allow you to get and set the year, month, day, hour, minute, second, and millisecond of date objects, using either local time or UTC (universal, or GMT) time.

Independent of input format, JavaScript will (by default) output dates in full text string format as shown:

Sun May 07 2023 15:08:20 GMT+0530 (India Standard Time)

​

Javascript Get Date Methods

Javascript Set Date Methods

Example for Set Method

// Get the current date

let currentDate = new Date();

​

// Set a countdown duration (e.g., 3 days)

let countdownDuration = 3; // in days

​

// Calculate the future date after the countdown

let futureDate = new Date(currentDate);

futureDate.setDate(currentDate.getDate() + countdownDuration);

​

// Display the current date and future date

console.log("Current Date:", currentDate.toDateString());

console.log("Future Date after Countdown:", futureDate.toDateString());

​

​

Q&A