Phương thức Date toLocaleString() trong JavaScript
Bùi Tấn Lực - 1036
- 06/09/2025
Chức năng của Phương thức Date toLocaleString() trong JavaScript
Phương thức Date toLocaleString() trong JavaScript dùng để lấy full chuỗi thời gian ngày, giờ của một đối tượng thời gian Date, bạn có thể lấy mặc định cấu hình của máy chủ hoặc theo các tùy chọn ngôn ngữ và tùy chọn đối tượng.
Cú pháp của Phương thức Date toLocaleString() trong JavaScript
Định dạng ngôn ngữ, thời gian tùy chọn theo mặc định của máy chủ
doituongdate.toLocaleString();
doituongdate: Là một biến trả về từ đối tượng new Date();
Định dạng ngôn ngữ, thời gian tùy chọn tự cài đặt
doituongdate.toLocaleString('tuychonngonngu',tuychonthoigian);
doituongdate: Là một biến trả về từ đối tượng new Date();
tuychonngonngu: Ngôn ngữ của các nước, ví dụ: vi-VN là tiếng việt, en-US là tiếng anh,..... tham khảo chi tiết ở phần dưới.
tuychonthoigian: Quy định cách hiển thị của ngày, tháng, năm, giờ, phút, thứ trong tuần, giây,.... tham khảo chi tiết ở phần dưới.
Các tùy chọn của Phương thức Date toLocaleString() trong JavaScript
Tùy chọn ngôn ngữ
'vi-VN': dành cho hour12 là true, buỗi sáng là SA, buổi chiều là CH.
'en-US': dành cho hour12 là true, buỗi sáng là AM, buổi chiều là PM.
Tùy chọn đối tượng
year: numeric (số), 2-digit (2 chữ số).
month: numeric (số), 2-digit (2 chữ số), long (tên tháng dài), short (tên tháng ngắn).
day: numeric (số), 2-digit (2 chữ số).
weekday: long (thứ dài), short (thứ ngắn).
hour: "numeric", "2-digit" (ví dụ: 7, 07).
minute: "numeric", "2-digit".
second: "numeric", "2-digit".
timeZoneName: "short", "long".
hour12: true (chế độ 12 giờ) hoặc false (chế độ 24 giờ).
Code Phương thức Date toLocaleString() trong JavaScript
<script>
var thoigian = new Date("September 02, 2025 19:05:08");
// Định dạng chuỗi thời gian ngày, giờ theo mặc định của máy chủ, tùy vào cài đặt 12h hay 24h
document.write("<b>// Định dạng chuỗi thời gian ngày, giờ theo mặc định của máy chủ, tùy vào cài đặt 12h hay 24h</b><br>");
document.write("Định dạng chuỗi thời gian ngày, giờ theo mặc định của máy chủ: "+thoigian.toLocaleString()+"<br>"); // Kết quả: 19:05:08 2/9/2025
// Định dạng giờ, phút, giây tùy chọn
document.write("<b>// Định dạng chuỗi thời gian ngày, giờ tùy chọn</b><br>");
const tuychon = {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
hour12: true,
};
document.write("Định dạng chuỗi thời gian vi-VN, ngày giờ tùy chọn: "+thoigian.toLocaleString('vi-VN',tuychon)+"<br>"); // Kết quả: lúc 7:05:08 CH Thứ Ba, 2 tháng 9, 2025
const tuychonhai = {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
hour12: false,
};
document.write("Định dạng chuỗi thời gian vi-VN, ngày giờ tùy chọn: "+thoigian.toLocaleString('vi-VN',tuychonhai)+"<br>"); // Kết quả: lúc 19:05:08 Thứ Ba, 2 tháng 9, 2025
const tuychonba = {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric',
hour: '2-digit',
minute: 'numeric',
second: 'numeric',
hour12: true,
};
document.write("Định dạng chuỗi thời gian en-US, ngày giờ tùy chọn: "+thoigian.toLocaleString('en-US',tuychonba)+"<br>"); // Kết quả: Tuesday, September 2, 2025 at 07:05:08 PM
</script>
Kết quả:
// Định dạng chuỗi thời gian ngày, giờ theo mặc định của máy chủ, tùy vào cài đặt 12h hay 24h
Định dạng chuỗi thời gian ngày, giờ theo mặc định của máy chủ: 19:05:08 2/9/2025
// Định dạng chuỗi thời gian ngày, giờ tùy chọn
Định dạng chuỗi thời gian vi-VN, ngày giờ tùy chọn: lúc 7:05:08 CH Thứ Ba, 2 tháng 9, 2025
Định dạng chuỗi thời gian vi-VN, ngày giờ tùy chọn: lúc 19:05:08 Thứ Ba, 2 tháng 9, 2025
Định dạng chuỗi thời gian en-US, ngày giờ tùy chọn: Tuesday, September 2, 2025 at 07:05:08 PM
Ứng dụng Date.toLocaleString() trong các trường hợp thực tế
Điểm hữu ích của Date.toLocaleString() nằm ở khả năng biến một giá trị ngày giờ thành chuỗi dễ đọc theo từng ngôn ngữ, khu vực và múi giờ. Nhờ đó, dữ liệu thời gian có thể được hiển thị phù hợp với giao diện website thay vì giữ nguyên dạng khó đọc.
Định dạng ngày giờ theo ngôn ngữ và khu vực
Cùng một đối tượng Date nhưng cách hiển thị ngày giờ có thể khác nhau tùy locale. Bạn có thể truyền mã ngôn ngữ và khu vực vào toLocaleString() để kiểm soát cách người dùng nhìn thấy dữ liệu thời gian.
const date = new Date();
console.log(date.toLocaleString("vi-VN"));
console.log(date.toLocaleString("en-US"));
Với vi-VN, ngày giờ được trình bày theo cách quen thuộc với người dùng Việt Nam. Trong khi đó, en-US sử dụng quy ước phổ biến tại Hoa Kỳ. Cách làm này đặc biệt hữu ích với website có người dùng đến từ nhiều quốc gia.
Hiển thị ngày giờ theo múi giờ mong muốn
Khi website phục vụ người dùng ở nhiều khu vực, chỉ định múi giờ giúp thời gian hiển thị đúng với ngữ cảnh. Tùy chọn timeZone có thể được truyền vào tham số thứ hai của phương thức.
const date = new Date();
console.log(
date.toLocaleString("vi-VN", {
timeZone: "Asia/Ho_Chi_Minh"
})
);
Điều này phù hợp với các trường hợp như lịch hẹn, thời gian sự kiện hoặc lịch làm việc. Thay vì phụ thuộc hoàn toàn vào múi giờ của thiết bị, website có thể chủ động chọn khu vực cần hiển thị.
Kết hợp tùy chọn để kiểm soát định dạng thời gian
toLocaleString() cho phép kết hợp nhiều tùy chọn để chỉ hiển thị những thành phần cần thiết. Chẳng hạn, giao diện có thể cần ngày đầy đủ nhưng chỉ lấy giờ và phút, không cần giây.
const date = new Date();
const formatted = date.toLocaleString("vi-VN", {
day: "2-digit",
month: "2-digit",
year: "numeric",
hour: "2-digit",
minute: "2-digit"
});
console.log(formatted);
Cách này giúp định dạng thời gian nhất quán với mục đích sử dụng. Với danh sách dữ liệu, bạn có thể hiển thị ngắn gọn; với lịch hoặc thông tin chi tiết, có thể bổ sung thêm các thành phần cần thiết mà không phải tự xử lý từng phần của ngày giờ.
Lời kết
Cảm ơn các bạn đã tham khảo bài viết Phương thức Date toLocaleString() trong JavaScript.
- 0 Bình luận
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *
