`Đối tượng` Date`

Bài viết này giải thích về đối tượng Date.

Chúng tôi sẽ giải thích từng bước về đối tượng Date, từ cơ chế cơ bản đến các thao tác thường dùng trong công việc thực tế, kèm các ví dụ cụ thể.

YouTube Video

Đối tượng Date`

Date object là gì?

Đối tượng Date trong JavaScript là đối tượng tiêu chuẩn dùng để xử lý ngày và giờ. Bên trong, nó quản lý ngày và giờ dựa trên số mili giây đã trôi qua kể từ ngày 1 tháng 1 năm 1970, 00:00:00 UTC.

Trước tiên, hãy tạo một đối tượng Date đại diện cho ngày và giờ hiện tại, rồi kiểm tra nội dung của nó.

1const now = new Date();
2console.log(now);

• Đoạn mã này tạo ra một đối tượng Date đại diện cho ngày và giờ hiện tại tại thời điểm thực thi. Định dạng hiển thị phụ thuộc vào môi trường thực thi, như trình duyệt hoặc hệ điều hành.

Cách tạo đối tượng Date

Đối tượng Date có thể được tạo theo nhiều cách tùy vào nhu cầu của bạn. Một điểm quan trọng rất dễ nhầm lẫn là tham số tháng bắt đầu từ 0 trong hàm tạo, nghĩa là tháng bắt đầu từ 0.

1const d1 = new Date();                     // Current date and time
2const d2 = new Date("2025-01-01");         // Create from an ISO date string
3const d3 = new Date(2025, 0, 1);           // January 1, 2025 (month is zero-based)
4const d4 = new Date(2025, 0, 1, 10, 30);   // January 1, 2025, 10:30
5
6console.log(d1, d2, d3, d4);

• Trong new Date(year, month, day), month có nghĩa là 0 là tháng 1 và 11 là tháng 12. Nếu bạn không hiểu quy tắc này, bạn có thể vô tình tạo ra ngày bị lệch 1 tháng, vì vậy hãy luôn cẩn thận.

Lấy từng thành phần của ngày và giờ

Bạn có thể lấy riêng biệt năm, tháng, ngày, giờ và thứ trong tuần từ một đối tượng Date. Tất cả các phương thức getter đều trả về giá trị là số.

1const date = new Date();
2
3console.log(date.getFullYear()); // Year
4console.log(date.getMonth());    // Month (0-based: 0 = January)
5console.log(date.getDate());     // Day of the month
6console.log(date.getHours());    // Hours
7console.log(date.getMinutes());  // Minutes
8console.log(date.getSeconds());  // Seconds
9console.log(date.getDay());      // Day of the week (0 = Sunday, 6 = Saturday)

• Cũng như khi tạo, hãy chú ý rằng getMonth() cũng bắt đầu từ 0. Khi sử dụng để hiển thị, thường sẽ cộng thêm 1 để điều chỉnh giá trị.
• getDay() trả về thứ trong tuần dưới dạng một con số. 0 đại diện cho Chủ nhật, và 6 đại diện cho Thứ bảy.

Thay đổi ngày và giờ

Date là một đối tượng có thể thay đổi, nghĩa là bạn có thể thay đổi giá trị của nó sau đó. Tính chất này rất hữu ích, nhưng bạn cần cẩn thận với các tác dụng phụ không mong muốn.

Bạn có thể sử dụng các phương thức set để thay đổi giá trị của một đối tượng Date hiện có.

1const date = new Date("2025-01-01");
2
3date.setFullYear(2026);
4date.setMonth(5);   // June
5date.setDate(15);
6
7console.log(date);

• setMonth() cũng bắt đầu từ 0. Đối tượng gốc sẽ bị thay đổi trực tiếp.

Cộng và trừ ngày

Phép tính ngày thường được thực hiện bằng cách sử dụng mili giây hoặc phương thức setDate(). Đối với các phép tính dựa trên ngày, sử dụng setDate() là trực quan và an toàn nhất.

1const date = new Date("2025-01-01");
2
3date.setDate(date.getDate() + 7);
4console.log(date);

• Trong ví dụ này, chúng ta tính ngày sau 7 ngày kể từ ngày được chỉ định. Dù cộng vượt sang tháng mới thì vẫn được điều chỉnh tự động.

So sánh các đối tượng Date

Đối tượng Date có thể so sánh như số. Bởi lẽ giá trị mili giây bên trong được so sánh.

1const a = new Date("2025-01-01");
2const b = new Date("2025-01-10");
3
4console.log(a < b);   // true
5console.log(a > b);   // false

• Nếu bạn muốn xác định thứ tự ngày tháng, không cần chuyển đổi gì thêm. Bạn có thể dùng các toán tử so sánh trực tiếp.

Làm việc với timestamp (mili giây)

Date có thể chuyển đổi sang và từ số đại diện cho mili giây (timestamp). Định dạng này thường được sử dụng trong các API hoặc tích hợp cơ sở dữ liệu.

1const now = Date.now();
2console.log(now);
3
4const date = new Date(now);
5console.log(date);

• Date.now() trả về thời gian hiện tại ở dạng mili giây. Nó rất hữu ích khi bạn muốn lưu trữ hoặc so sánh giá trị dưới dạng số.

Định dạng ngày dưới dạng chuỗi

Hiển thị nguyên đối tượng Date thường cho ra định dạng không phù hợp với nhu cầu. Do đó, bạn nên định dạng rõ ràng theo yêu cầu của mình.

1const date = new Date("2025-01-01");
2
3const formatted = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
4console.log(formatted);

• Bằng cách tự định dạng, bạn có thể hoàn toàn kiểm soát định dạng hiển thị. Trong thực tế, thường sử dụng các thư viện cho mục đích này.

Sự khác biệt giữa UTC và giờ địa phương

Date cung cấp các phương thức xử lý cả giờ địa phương và UTC. Việc hiểu đúng sự khác biệt này rất quan trọng khi tích hợp server hoặc làm việc xuyên quốc gia.

1const date = new Date();
2
3console.log(date.getHours());    // Local time (hours)
4console.log(date.getUTCHours()); // UTC time (hours)

• Các phương thức getUTC* luôn trả về giá trị dựa trên UTC. Hãy đặc biệt cẩn thận khi xử lý dữ liệu qua nhiều múi giờ.

Lưu ý khi sử dụng đối tượng Date

Date tiện lợi nhưng cũng có những điểm dễ gây nhầm lẫn. Đặc biệt, tháng bắt đầu từ 0 và tính có thể thay đổi của đối tượng là nguyên nhân phổ biến gây lỗi.

Hãy xem các ví dụ cụ thể dưới đây để thấy tác động của việc Date có thể thay đổi được (mutable).

1const original = new Date("2025-01-01");
2const copy = new Date(original);
3
4copy.setDate(10);
5
6console.log(original);
7console.log(copy);

• Nếu bạn muốn giữ nguyên ngày giờ gốc, hãy luôn tạo một bản sao. Chỉ cần chú ý đến điểm này sẽ giúp bạn tránh được các lỗi không mong muốn.

Lý do tại sao Date khó xử lý và tiêu chí để sử dụng các thư viện

Đối tượng Date cung cấp đầy đủ các tính năng cơ bản, nhưng trong thực tế có những tình huống khó sử dụng. Các vấn đề phổ biến bao gồm tháng và ngày trong tuần tính từ 0, dễ nhầm lẫn giữa thời gian địa phương và UTC, cũng như việc đối tượng có thể thay đổi được. Những vấn đề này có thể dẫn đến nhiều lỗi hơn khi xử lý ngày tháng trở nên phức tạp.

Date đủ để lấy và so sánh ngày một cách đơn giản, nhưng tính dễ đọc và bảo trì của mã nguồn có xu hướng giảm khi phải tính toán hoặc định dạng ngày nhiều hơn.

Nếu bạn có các yêu cầu như sau, bạn nên cân nhắc sử dụng các thư viện xử lý ngày nhẹ như dayjs hoặc date-fns.

• Bạn cần xử lý múi giờ một cách rõ ràng
• Bạn thường xuyên cần thực hiện các phép tính về ngày hoặc khoảng thời gian
• Bạn muốn thay đổi định dạng hiển thị một cách linh hoạt
• Bạn muốn xử lý ngày tháng và thời gian theo cách bất biến (immutable)

Tóm tắt

Đối tượng Date là công cụ cơ bản nhất để xử lý ngày giờ trong JavaScript. Bằng cách hiểu rõ các đặc điểm và thực hiện đúng các thao tác tạo, lấy giá trị, tính toán, định dạng, bạn có thể sử dụng nó an toàn trong công việc thực tế.

Sau khi nắm vững kiến thức cơ bản, sử dụng các thư viện về ngày tháng khi cần thiết là một lựa chọn thực tiễn.

Bạn có thể làm theo bài viết trên bằng cách sử dụng Visual Studio Code trên kênh YouTube của chúng tôi. Vui lòng ghé thăm kênh YouTube.

YouTube Video