Chapter 9: JavaScript Date

JavaScript provides a built-in Date object that allows you to work with dates and times. This chapter covers the basics of working with dates and the various methods available to manipulate and format dates.

Basics of Dates

The Date object in JavaScript represents a single moment in time. Dates and times are represented as the number of milliseconds elapsed since January 1, 1970, 00:00:00 UTC (known as the Unix epoch).

Creating Dates

You can create a new Date object in several ways:

1. Current Date and Time

Creates a Date object for the current date and time.

Syntax:

let now = new Date();

Example:

let now = new Date();
console.log(now); // Output: Current date and time

2. Specific Date and Time

Creates a Date object for a specific date and time using a date string or individual date and time components.

Syntax:

let specificDate = new Date("YYYY-MM-DDTHH:mm:ss");
let specificDate = new Date(
  year,
  monthIndex,
  day,
  hours,
  minutes,
  seconds,
  milliseconds
);

Example:

let dateFromString = new Date("2024-08-19T12:00:00");
let dateFromComponents = new Date(2024, 7, 19, 12, 0, 0); // August is month index 7
console.log(dateFromString); // Output: Mon Aug 19 2024 12:00:00 GMT...
console.log(dateFromComponents); // Output: Mon Aug 19 2024 12:00:00 GMT...

Date Components

You can retrieve various components of a date (year, month, day, etc.) using the following methods:

1. Get Full Year

Returns the year of the date.

Syntax:

date.getFullYear();

Example:

let date = new Date();
console.log(date.getFullYear()); // Output: Current year

2. Get Month

Returns the month of the date (0 for January, 1 for February, etc.).

Syntax:

date.getMonth();

Example:

let date = new Date();
console.log(date.getMonth()); // Output: Current month (0-11)

3. Get Date

Returns the day of the month.

Syntax:

date.getDate();

Example:

let date = new Date();
console.log(date.getDate()); // Output: Current day of the month

4. Get Day

Returns the day of the week (0 for Sunday, 1 for Monday, etc.).

Syntax:

date.getDay();

Example:

let date = new Date();
console.log(date.getDay()); // Output: Day of the week (0-6)

5. Get Hours

Returns the hour of the date.

Syntax:

date.getHours();

Example:

let date = new Date();
console.log(date.getHours()); // Output: Current hour

6. Get Minutes

Returns the minutes of the date.

Syntax:

date.getMinutes();

Example:

let date = new Date();
console.log(date.getMinutes()); // Output: Current minutes

7. Get Seconds

Returns the seconds of the date.

Syntax:

date.getSeconds();

Example:

let date = new Date();
console.log(date.getSeconds()); // Output: Current seconds

8. Get Milliseconds

Returns the milliseconds of the date.

Syntax:

date.getMilliseconds();

Example:

let date = new Date();
console.log(date.getMilliseconds()); // Output: Current milliseconds

Date Methods

The Date object includes various methods to manipulate and format dates.

Setting Date Components

You can set the various components of a date using the following methods:

1. Set Full Year

Sets the year of the date.

Syntax:

date.setFullYear(year);

Example:

let date = new Date();
date.setFullYear(2025);
console.log(date); // Output: Date with year set to 2025

2. Set Month

Sets the month of the date.

Syntax:

date.setMonth(monthIndex);

Example:

let date = new Date();
date.setMonth(11); // December
console.log(date); // Output: Date with month set to December

3. Set Date

Sets the day of the month.

Syntax:

date.setDate(day);

Example:

let date = new Date();
date.setDate(15);
console.log(date); // Output: Date with day set to 15

4. Set Hours

Sets the hour of the date.

Syntax:

date.setHours(hours);

Example:

let date = new Date();
date.setHours(9);
console.log(date); // Output: Date with hour set to 9 AM

5. Set Minutes

Sets the minutes of the date.

Syntax:

date.setMinutes(minutes);

Example:

let date = new Date();
date.setMinutes(30);
console.log(date); // Output: Date with minutes set to 30

6. Set Seconds

Sets the seconds of the date.

Syntax:

date.setSeconds(seconds);

Example:

let date = new Date();
date.setSeconds(45);
console.log(date); // Output: Date with seconds set to 45

7. Set Milliseconds

Sets the milliseconds of the date.

Syntax:

date.setMilliseconds(milliseconds);

Example:

let date = new Date();
date.setMilliseconds(500);
console.log(date); // Output: Date with milliseconds set to 500

Formatting Dates

To format dates into readable strings, you can use various methods:

1. Date to String

Converts the date to a string representation.

Syntax:

date.toString();

Example:

let date = new Date();
console.log(date.toString()); // Output: Human-readable date string

2. Date to UTC String

Converts the date to a string in UTC time.

Syntax:

date.toUTCString();

Example:

let date = new Date();
console.log(date.toUTCString()); // Output: UTC date string

3. Date to ISO String

Converts the date to an ISO 8601 string.

Syntax:

date.toISOString();

Example:

let date = new Date();
console.log(date.toISOString()); // Output: ISO 8601 string

4. Date to Locale String

Converts the date to a string based on the locale.

Syntax:

date.toLocaleString(locales, options);

Example:

let date = new Date();
console.log(
  date.toLocaleString("en-US", {
    weekday: "long",
    year: "numeric",
    month: "long",
    day: "numeric",
  })
);
// Output: Long date format based on locale

Comparing Dates

To compare dates, you can use relational operators or the getTime() method to compare the number of milliseconds since the Unix epoch.

Example:

let date1 = new Date();
let date2 = new Date("2024-12-31");

console.log(date1 > date2); // Output: true or false based on comparison

Using getTime():

let date1 = new Date();
let date2 = new Date("2024-12-31");

console.log(date1.getTime() > date2.getTime()); // Output: true or false based on comparison