site logo


: (All)
❮  Go Back

11. Mastering JavaScript Dates: Creation, Formatting, and Manipulation

Posted on 2025-10-12 15:04:08

Price: $0.00

Quota Left: 0

By coldshadow44

Introduction

In JavaScript, working with dates and times is essential for many applications, from displaying current timestamps to scheduling events. The Date object in JavaScript provides a powerful way to handle dates and times. This guide explores how to create Date objects, format them, and manipulate them using various methods.


1. Creating a JavaScript Date Object

To create a new Date object, you can use the Date() constructor in several ways:

  1. Current Date and Time:

const now = new Date();
console.log(now); // Outputs current date and time
  1. Specific Date and Time:

const specificDate = new Date('2025-10-12T19:02:40');
console.log(specificDate); // Outputs: Sun Oct 12 2025 19:02:40 GMT+0600 (Bangladesh Standard Time)
  1. Date from Unix Timestamp:

const timestampDate = new Date(1680000000000);
console.log(timestampDate); // Outputs: Date corresponding to the timestamp
  1. Date from Date Components:

const dateFromComponents = new Date(2025, 9, 12, 19, 2, 40);
console.log(dateFromComponents); // Outputs: Sun Oct 12 2025 19:02:40 GMT+0600 (Bangladesh Standard Time)


2. Formatting JavaScript Dates

JavaScript provides several methods to format dates:

  1. toDateString(): Returns the date portion of a Date object as a human-readable string.

console.log(now.toDateString()); // Outputs: Sun Oct 12 2025
  1. toLocaleDateString(): Returns a date string based on the locale and options provided.

console.log(now.toLocaleDateString('en-GB')); // Outputs: 12/10/2025
  1. toLocaleString(): Returns a string representing the date and time in the locale-specific format.

console.log(now.toLocaleString('en-GB')); // Outputs: 12/10/2025, 19:02:40
  1. toISOString(): Returns the date and time in ISO 8601 format.

console.log(now.toISOString()); // Outputs: 2025-10-12T13:02:40.000Z


3. JavaScript Date Methods

JavaScript provides various methods to retrieve date and time components:

  1. Get Methods:

console.log(now.getFullYear()); // Outputs: 2025
console.log(now.getMonth()); // Outputs: 9 (October, as months are 0-indexed)
console.log(now.getDate()); // Outputs: 12
console.log(now.getHours()); // Outputs: 19
console.log(now.getMinutes()); // Outputs: 2
console.log(now.getSeconds()); // Outputs: 40
console.log(now.getMilliseconds()); // Outputs: 0
console.log(now.getDay()); // Outputs: 0 (Sunday)
console.log(now.getTime()); // Outputs: 1680000000000
  1. Set Methods:

now.setFullYear(2026);
now.setMonth(11); // December
now.setDate(25);
now.setHours(10);
now.setMinutes(30);
now.setSeconds(0);
now.setMilliseconds(0);
console.log(now); // Outputs: Fri Dec 25 2026 10:30:00 GMT+0600 (Bangladesh Standard Time)


4. Manipulating Dates

You can manipulate dates by adding or subtracting time:

  1. Adding Days:

now.setDate(now.getDate() + 5);
console.log(now); // Outputs: Wed Dec 30 2026 10:30:00 GMT+0600 (Bangladesh Standard Time)
  1. Subtracting Days:

now.setDate(now.getDate() - 10);
console.log(now); // Outputs: Sat Dec 20 2026 10:30:00 GMT+0600 (Bangladesh Standard Time)
  1. Adding Months:

now.setMonth(now.getMonth() + 2);
console.log(now); // Outputs: Tue Feb 20 2027 10:30:00 GMT+0600 (Bangladesh Standard Time)
  1. Subtracting Months:

now.setMonth(now.getMonth() - 3);
console.log(now); // Outputs: Sat Nov 20 2026 10:30:00 GMT+0600 (Bangladesh Standard Time)


5. Date Comparison

You can compare dates by converting them to timestamps:


const date1 = new Date('2025-10-12');
const date2 = new Date('2025-10-13');

if (date1.getTime() < date2.getTime()) {
console.log('date1 is earlier than date2');
} else {
console.log('date1 is not earlier than date2');
}


Conclusion

Understanding JavaScript's Date object is crucial for handling dates and times in web development. By mastering date creation, formatting, and manipulation methods, you can build dynamic applications that interact with time effectively.



Member's Sites: