programming javascript

Hướng dẫn dùng dayte JavaScript

Hôm nay bạn hãy cùng mình đi vào tìm hiểu về khái niệm cũng như cách sử dụng date (ngày) trong ngôn ngữ lập trình Javascript để phát triển web nhé.

Date Javascript Là Gì?

Date (Ngày) là một object trong javascript. Nó lưu trữ dữ liệu ngày, giờ và cung cấp các phương thức để chúng ta làm việc với thời gian một cách dễ và thuận tiện hơn.

Trong thực tế khi phát triển web thì bạn cũng sẽ tiếp xúc nhiều với object date như tạo lịch, cuộc hẹn, thời gian biểu....

Bây giờ chúng ta sẽ đi vào tìm hiểu cú pháp của nó nhé:

Cú Pháp Date Javascript

Chúng ta có nhiều cách để khởi tạo một đối tượng Date trong ngôn ngữ javascript nhưng cách mặc định là khởi tạo bằng từ khóa new và không có tham số nào được truyền vào trong phương thức khởi tạo. Để hiểu rõ hơn bạn xem cú pháp nó nhé:

let ngayGio = new Date();

Bây giờ chúng ta thử xem giá trị của biến ngayGio khi xuất ra màn hình thế nào nhé:

Đoạn Code:

let ngayGio = new Date();
console.log(ngayGio);

Kết Quả:

Cách khai báo này sẽ cung cấp chúng ta các thông tin như sau:

Sat = Saturday = Thứ bảy: Dữ liệu thứ nhất là hiển thị thứ trong tuần hiện tại.
May = Tháng Năm: Dữ liệu thứ hai hiển thị tháng hiện tại.
16: Dữ liệu này hiển thị ngày hiện tại.
2020: Dữ liệu này hiển thị năm hiện tại.
18:49:47: Dữ liệu này hiển thị theo giờ: phút: giây hiện tại.
GMT+0700: Dữ liệu này hiển thị múi giờ của khu vực hiện tại.

Các Cách Khác Tạo Đối Tượng Date Javascript

Cách thứ nhất:

Đầu tiên chúng ta sẽ đi vào cú pháp của nó nhé:

let ngayGio = new Date(Mốc Thời gian);

Trong ngôn ngữ lập trình Javascript thì chúng ta có một mốc thời gian bằng 0 với ngày mặc định là 01 January, 1970 00:00:00 Universal Time (UTC). Mốc thời gian này sẽ được tính theo mili giây (nghĩa là 1/1000 giây) và nó sẽ lấy mốc thời gian bằng 0 sau đó dựa vào thời gian mily giây chúng ta đưa vào mà trả về kết quả tương ứng. Bây giờ để dễ hiểu hơn chúng ta cùng nhau đi vào ví dụ sau nhé:

Mình có lưu ý là 1 ngày sẽ có số mily giây là: 24 * 3600 * 1000 = 86400000 mily giây.

Đoạn Code:

let ngay1_Thang1_Nam1970 = new Date(0);
console.log(ngay1_Thang1_Nam1970);

let ngay2_Thang1_Nam1970 = new Date(86400000);
console.log(ngay2_Thang1_Nam1970);

Kết Quả:

Như bạn thấy thì chúng ta dùng số 86400000 để xác định số mily giây cho một ngày. Với phương thức khởi tạo Date() số này sẽ tính thời gian bắt đầu từ cột mốc bằng 0 là ngày 1 tháng 1 năm 1970 do đó chúng ta có kết quả ngày 2 tháng 1 năm 1970 ngoài màn hình.

Cách thứ hai:

Chúng ta sẽ đưa một tham số với kiểu dữ liệu chuỗi để tạo ra một đối tượng Date(). Để hiểu rõ hơn bạn xem cú pháp nó sau nhé:

let ngayGio = new Date(Chuỗi Thời Gian);

Bây giờ chúng ta đi vào ví dụ cụ thể để hiểu rõ hơn nhé:

Đoạn Code:

let ngayGio = new Date("2019-09-25");
console.log(ngayGio);

Kết Quả:

Bạn có thể thấy là nó đưa ra thứ ngày tháng... cụ thể và chúng ta cũng có thể sử dụng các phương thức liên quan đến đối tượng Date() cho biến ngayGio .

Cách thứ ba:

Chúng ta sẽ sử dụng các tham số để mô tả chi tiết thời gian cụ thể. Để hiểu rõ hơn bạn xem cú pháp sau nhé:

let ngayGio = new Date(Năm, tháng, ngày, giờ, phút, giây, mily giây);

Để dễ hình dung chúng ta đi vào ví dụ cụ thể sau đây nhé:

Đoạn Code:

let ngayGio = new Date(2019, 09, 25 , 2, 0, 0, 0);
console.log(ngayGio);

Kết Quả:

Các Phương Thức Lấy Thời Gian Date Javascript

Khi bạn có một đối tượng Date() thì nó sẽ có các phương thức giúp chúng ta lấy như năm, tháng, ngày... cụ thể của đối tượng đó. Để dễ hình dung bạn xem bảng phía dưới, nó sẽ miêu tả chi tiết các phương thức get(lấy) trong đối tượng Date nhé:

Thời GianPhương ThứcPhạm ViGiải ThíchNămThángNgàyNgày Trong TuầnGiờPhútGiâyMily GiâyMốc thời gian

getFullYear()	YYYY	2020
getMonth()	0-11	Với 0 là tháng một ... 11 là tháng 12
getDate()	1-31	Với 1 là ngày đầu tiên trong tháng
getDay()	0-6	0 là chủ nhật
getHours()	0-23
getMinutes()	0-59
getSeconds()	0-59
getMilliseconds()	0-999
getTime()

Bây giờ chúng ta sẽ tạo một đối tượng Date() cho thời gian hiện tại và lấy từng thành phần thời cụ thể cho nó thông qua đoạn code dưới đây nhé:

Đoạn Code:

let ngayGio = new Date();
console.log(ngayGio);
/*Lấy Các Thành Phần Trong Date()*/
console.log("Năm Hiện Tại là: " + ngayGio.getFullYear());
console.log("Tháng Hiện Tại là: " + ngayGio.getMonth());
console.log("Ngày Hiện Tại là: " + ngayGio.getDate());
console.log("Ngày Trong Tuần Hiện Tại là: " + ngayGio.getDay());
console.log("Giờ Hiện Tại là: " + ngayGio.getHours());
console.log("Phút Hiện Tại là: " + ngayGio.getMinutes());
console.log("Giây Hiện Tại là: " + ngayGio.getSeconds());
console.log("Mily Giây Hiện Tại là: " +ngayGio.getMilliseconds());
console.log("Mốc Thời Gian Hiện Tại là: " + ngayGio.getTime());

Kết Quả:

Các Phương Thức Thiết Lập Thời Gian Date Javascript

Ngoài việc lấy thông tin thời gian thì chúng ta có thể thiết lập các thời gian cụ thể trong đối tượng Date(). Để hiểu rõ hơn bạn xem bảng phía dưới miêu tả các phương thức thiết lập trong đối tượng này nhé:

Thời GianPhương ThứcPhạm ViGiải ThíchNămThángNgàyNgày Trong TuầnGiờPhútGiâyMily GiâyMốc thời gian

setFullYear()	YYYY	2020
setMonth()	0-11	Với 0 là tháng một ... 11 là tháng 12
setDate()	1-31	Với 1 là ngày đầu tiên trong tháng
setDay()	0-6	0 là chủ nhật
setHours()	0-23
setMinutes()	0-59
setSeconds()	0-59
setMilliseconds()	0-999
setTime()

Bây giờ để dễ hình dung chúng ta đi vào ví dụ cụ thể sau đây nhé:

Đoạn Code:

let ngayGio = new Date("2019-09-25");
console.log(ngayGio);

ngayGio.setMonth(05);
ngayGio.setFullYear(2020);
ngayGio.setDate(12);
console.log(ngayGio);

Kết Quả:

Tự Động Sử Lỗi Time Trong Date Javascript

Đây là một tiện ích giúp tự động chỉnh sửa khi người dùng khai báo sai trong thiết lập object Date(). Ví dụ khi bạn khai báo thời gian ngày 35 tháng 2 năm 2020 thì đối tượng Date() sẽ tự động chuyển sang tháng 3 với số ngày dư sẽ được cộng thêm tương ứng. Để bạn hiểu rõ hơn chúng ta cùng xem đoạn code sau nhé:

Đoạn Code:

let ngayGio = new Date(2020, 01, 35);
console.log(ngayGio);

Kết Quả:

Chuyển Date Sang Dạng Number Javascript

Mục đích chúng ta chuyển Date() sang dạng số để có thể thuận tiện trong việc tính toán khoảng thời gian của một hành động nào đó trong chương trình ví dụ như là thời gian chạy của một hàm, vòng lặp... Giá trị chuyển sang kiểu số sẽ có đơn vị là mily giây và nó tương ứng với hàm getTime(). Bây giờ chúng ta xem ví dụ chuyển sang dạng số sau đây nhé:

Đoạn Code:

let ngayGio = new Date();
console.log(+ngayGio);
console.log(typeof +ngayGio);

Kết Quả:

Chúng ta chỉ cần gọi biến chứa object Date() với dấu + phía trước thì đã nó sẽ chuyển sang kiểu dữ liệu dạng số.

Các object Date() có thể sử dụng phép tính trừ mà không cần chuyển sang dạng số giúp chúng ta tính toán thời gian cụ thể của một sự kiện nào đó. Để hiểu rõ hơn bạn xem ví dụ sau nhé:

Đoạn Code:

let batDau = new Date();
for(let i = 0; i < 10000000; i++){
i = i + 3;
}
let ketThuc = new Date();
let thoiGianChayHam = ketThuc- batDau;
console.log("Thời gian khi hàm chạy là " + thoiGianChayHam + " mily giây.");

Kết Quả:

Khi chương trình chạy nó sẽ đi từ trên xuống dưới thì chúng ta sẽ dùng biến batDau để lưu trữ thời gian trước khi vòng lặp chạy và biến ketThuc dùng để lưu trữ thời gian sau khi chạy xong vòng lặp. Và cuối cùng chúng ta có kết quả thời gian chạy của vòng lặp là 8 mily giây sau khi thực hiện phép trừ giữa hai biến.

Phương Thức Date.now()

Nếu như bạn không cần các phương thức của object Date() mà chỉ cần lấy thời gian như ở ví dụ trên thì chúng ta có thể gọi thẳng bằng phương thức Date.now(). Để hiểu rõ hơn bạn xem đoạn code phía dưới khi ta sử dụng phương thức Date.now() để giải quyết vấn đề trên nhé:

Đoạn Code:

let batDau = Date.now();
for(let i = 0; i < 10000000; i++){
i = i + 3;
}
let ketThuc = Date.now();
let thoiGianChayHam = ketThuc- batDau;
console.log("Thời gian khi hàm chạy là " + thoiGianChayHam + " mily giây.");

Kết Quả:

Phương Thức Date.parse()

Phương thức Date.parse() giúp chúng ta đọc dữ liệu thời gian được cung cấp dưới dạng chuỗi. Để hiểu rõ hơn bạn xem cú pháp của nó sau nhé:

Date.parse(Dữ liệu Chuỗi Thời Gian);

Với dữ liệu chuỗi thời gian sẽ có cấu trúc như sau: YYYY-MM-DD-THH-mm:ss.sssZ. Và thành phần sẽ được định dạng như như sau:

YYYY-MM-DD: là thời gian Năm-Tháng-Ngày.
T: Là dấu ngăn cách với các thành phần khác.
HH:mm:ss.sss: là Giờ:Phút:Giây:Mily Giây.
Z: Là múi giờ của khu vực

Để bạn hiểu rõ hơn chúng ta cùng nhau đi vào ví dụ cụ thể sau nhé:

Đoạn Code:

let thoiGian = Date.parse('2015-02-26T16:50:50.333-07:00');
let ngayGio = new Date(thoiGian);
console.log(ngayGio);

Kết Quả:

Tổng kết:

Qua đây mình mong bài viết sẽ giúp bạn hiểu được khái niệm và cách sử dụng object Date() trong ngôn ngữ Javascript và nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!

Date Javascript Là Gì?

Cú Pháp Date Javascript

Các Cách Khác Tạo Đối Tượng Date Javascript

Cách thứ nhất:

Cách thứ hai:

Cách thứ ba:

Các Phương Thức Lấy Thời Gian Date Javascript

Các Phương Thức Thiết Lập Thời Gian Date Javascript

Tự Động Sử Lỗi Time Trong Date Javascript

Chuyển Date Sang Dạng Number Javascript

Phương Thức Date.now()

Phương Thức Date.parse()

Tổng kết:

Bài Viết Liên Quan

Toplist

Bài mới nhất

Chủ đề