PHẦN CƠ BẢN
VÒNG LẶP
DATA TYPES
EVENTS
DOM
BOM
OBJECT
BỔ SUNG
THỰC HÀNH
JAVASCRIPT CĂN BẢN
CÁC CHỦ ĐỀ
BÀI MỚI NHẤT
MỚI CẬP NHẬT

Đối tượng Date trong Javascript - Định dạng format date

Trong bài này chúng ta sẽ tìm hiểu đến đối tượng Date trong Javascript, qua đó bạn sẽ biết cách định dạng format ngày giờ trong JS.

test php

banquyen png
Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

Date là một đối tượng chuyên dùng để xử lý ngày giờ trong Javascript. Vì nó là ngôn ngữ ở client nên thời gian mà nó lấy được chính là thời gian được thiết lập trên máy của client. Vì vậy, khi lập trình thì bạn không nên lấy thông tin ngày giờ từ JS để lưu trữ vào hệ thống mà thay vào đó hãy sử dụng ngôn ngữ phía server.

1. Đối tượng Date trong Javascript

Date là một object (đối tượng) giúp lập trình viên lấy được thời gian hiện tại ở máy khách client, qua đó sẽ xử lý những chức năng cần đến thông số thời gian này.

Ví dụ, trang web bạn cần thiết lập thời gian cứ 1 phút là tự động reload trang thì lúc này có thể sử dụng đối tượng Date để tính toán.

Bài viết này được đăng tại [free tuts .net]

Cú pháp khởi tạo của date trong JS như sau:

// Cách 1
var timeObj = new Date();
var timeObj = new Date(value);
var timeObj = new Date(dateString);

// Cách 2
var timeObj = new Date(year, monthIndex);
var timeObj = new Date(year, monthIndex, day);
var timeObj = new Date(year, monthIndex, day, hours);
var timeObj = new Date(year, monthIndex, day, hours, minutes);
var timeObj = new Date(year, monthIndex, day, hours, minutes, seconds);
var timeObj = new Date(year, monthIndex, day, hours, minutes, seconds, milliseconds);

Chúng ta có hai cách dùng như sau:

Cách thứ nhất: Truyền vào tham số là chuỗi hoặc một giá trị.

  • Nếu bạn không truyền tham số nào vào thì nó sẽ trả về ngày giờ hiện tại, tức là ngay thời điểm chạy lệnh.
  • dateString là một chuỗi định dạng ngày tháng cần lấy.
  • value cũng có thể là một dãy số được chuyển từ ngày giờ cần lấy sang miliseconds

Cách thứ hai: Nó có tối đa là 7 tham số truyền vào:

  • year là năm cần lấy
  • monthIndex là tháng cần lấy
  • day là ngày trong tháng cần lấy
  • hours là giờ cần lấy
  • minuites là phút cần lấy
  • seconds là giây cần lấy

Dưới đây là một vài ví dụ tổng hợp:

let today = new Date()
let birthday = new Date('December 17, 1995 03:24:00')
let birthday = new Date('1995-12-17T03:24:00')
let birthday = new Date(1995, 11, 17)           
let birthday = new Date(1995, 11, 17, 3, 24, 0)

Ví dụ dưới đây mình đang lấy thời gian hiện tại trên máy khách client.

var dateObj = new Date();
document.write(dateObj);

Ví dụ sau đây là bốn cách khởi tạo thông thường nhất.

// Thời gian hiện tại
new Date();

// Tham số truyền vào là mili giây
new Date(milliseconds);

// Tham số truyền vào là chuỗi ngày tháng
new Date(dateString);

// Tham số truyền vào gồm
//  - year:         năm
//  - month:        tháng
//  - day:          ngày
//  - hours:        giờ
//  - minutes:      phút
//  - seconds:      giây
//  - milliseconds: mini giây
new Date(year, month, day, hours, minutes, seconds, milliseconds);

Khi bạn truyền tham số vào thì đối tượng đó sẽ tự nhận diện và chuyển đổi về đúng định dạng ngày tháng nên bạn cứ yên tâm nhé.

Ví dụ: Khởi tạo một đối tượng với giá trị là ngày 20/11/2013

Demo RUN
var dateObj = new Date(2013, 11, 20);

Cái khó ở phần này là định dạng format của ngày tháng khi in ra ngoài trình duyệt rất khó đọc, điều này cũng bình thường bởi vì nó có quy tắc format riêng.

2. Định dạng (format) của Date trong Javascript

Có ba định dạng chính đó là:

  • ISO
  • Long
  • Short

Định dạng ISO

Định dạng chuẩn của ISO 8601 là (YYYY-MM-DD) hoặc (YYYY-MM) hoặc (YYYY).

Có một lưu ý nếu bạn truyền vào không đủ (ngày - tháng - năm - giờ - phút - giây) thì mặc định các tham số khác sẽ lấy thời gian nhỏ nhất.

Demo RUN
var ISO_1 = new Date("2014-11-20");
var ISO_2 = new Date("2014-11");
var ISO_3 = new Date("2014");

Định dạng Long

Định dạng Long tức là bạn truyền vào với tên của tháng là ba chữ cái đầu tiên ghi bằng tiếng Anh, lúc này bạn có thể đặt vị trí của nó thế nào cũng được vì đối tượng Date tự nhận diện và chuyển đổi.

Demo RUN
var LONG_1 = new Date("Mar 25 2015");
var LONG_2 = new Date("2015 Mar 25");
var LONG_3 = new Date("25 2015 Mar");

Chạy lên các bạn thấy cả ba ví dụ đều có kết quả như nhau.

Định dạng Short

Định dạng Short được lưu trữ dưới dạng MM/DD/YYYY hoặc YYYY/MM/DD hoặc MM-DD-YYYY hoặc YYYY-MM-DD/

Demo RUN
var SHORT_1 = new Date("03-25-2015");
var SHORT_2 = new Date("03/25/2015");
var SHORT_3 = new Date("2015/03/25");
var SHORT_4 = new Date("2015-03-25");

Định dạng đầy đủ

Trên là những định dạng ghi tắt, nếu truyền đầy đủ thì bạn phải truyền đẩy đủ (ngày - tháng - năm - giờ - phút - giây - timezone):

var d = new Date("Wed Mar 25 2015 09:56:24 GMT+0100 (W. Europe Standard Time)");

3. Date javascript format dd/mm/yyyy

Đối với người Việt thì định dạng thường được sử dụng nhất đó là dd/mm/yyyy. Vậy cách khai báo nó như thế nào?

Trong Javascript không hỗ trợ định dạng này vì nó đang sử dụng chuẩn quốc tế. Bạn phải sử dụng một thủ thuật chuyển đổi đơn giản như sau:

function getDDMMYYY(dateString) {
    var dateParts = dateString.split("/");

    // Tháng bắt đầu từ 0 nên ta phải giảm đi 1: dataParts[1] - 1
    return new Date(+dateParts[2], dateParts[1] - 1, +dateParts[0]); 
}
getDDMMYYYY('23/10/2015');

4. Lời kết

Vậy là chúng ta đã tìm hiểu xong đối tượng Date trong Javascript. Qua bài này bạn cũng đã biết được các định dạng format của đối tượng date, cách truyền các tham số vào hàm khởi tạo của Date như thế nào. Hẹn gặp lại các bạn ở bài tiếp theo.

Cùng chuyên mục:

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Functional Programming là gì? Tại sao và khi nào bạn nên sử dụng trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

Những tính năng mới trong ES6+ trong JavaScript

4 cách tránh memory leaks trong JavaScript

4 cách tránh memory leaks trong JavaScript

Capturing và bubbling Event trong Javascript

Capturing và bubbling Event trong Javascript

Phân biệt prototype và __proto__ trong JavaScript

Phân biệt prototype và __proto__ trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Cách hoạt động của Event Loop trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Phương thức bind(), call(), và apply() trong JavaScript

Cách khắc phục lỗi

Cách khắc phục lỗi "hoisting" trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Sử dụng Promise.all và Promise.race để quản lý các Promise trong JavaScript

Xử lý bất đồng bộ bằng vòng lặp for-await trong JavaScript

Xử lý bất đồng bộ bằng vòng lặp for-await trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Sự khác biệt giữa Promise, Callback và Async/Await trong JavaScript

Cách sử dụng Async functions trong JavaScript

Cách sử dụng Async functions trong JavaScript

Hàm String isspace() trong Python

Hàm String isspace() trong Python

Cách tạo số ngẫu nhiên trong Javascript

Cách tạo số ngẫu nhiên trong Javascript

Hướng dẫn cách tạo một số ngẫu nhiên ...

Cách gộp hai object javascript lại với nhau

Cách gộp hai object javascript lại với nhau

Cách lấy chiều dài của object trong Javascript

Cách lấy chiều dài của object trong Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Hướng dẫn giải phương trình bậc 1 bằng Javascript

Cách dùng nextSibling trong javascript

Cách dùng nextSibling trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng insertAdjacentHTML trong javascript

Cách dùng innerHTML trong Javascript

Cách dùng innerHTML trong Javascript

Top