1. Đối tượng date trong JavaScript?

Date là một object hổ trợ ta có thể lấy thời gian ở client, qua đó ta có thể sử dụng các giá trị này cho các công việc khác cần nó. Hay nói một cách chung nhất là date là một đối tượng được tích hợp sẵn chuyên xử lý vấn đề về thời gian.

2. Khởi tạo đối tượng date trong JavaScript

Theo mặc định, JavaScript sẽ sử dụng múi giờ của trình duyệt và hiển thị ngày dưới dạng chuỗi văn bản đầy đủ. Ví dụ:

Thứ Ba ngày 21 tháng 12 năm 2021 10:07:24 GMT + 0700 (Giờ Đông Dương)

Để khởi tạo đối tượng date thì ta có 4 cách để khởi tạo:

  • Khởi tạo ngày giờ tại thời điểm hiện tại
  • Khởi tạo ngày giờ từ giá trị time millisecond
  • Khởi tạo ngày giờ từ một dateString
  • Khởi tạo ngày giờ từ một date string dạng atrribute

2.1. Khởi tạo ngày giờ tại thời điểm hiện tại

Ta sẽ sử dụng new Date() để tạo một đối tượng ngày mới theo ngày và giờ hiện tại

<div>click vào button để xem kết quả</div>
   <button type="button" onclick="get()">Click</button>
   <p id="result"></p>
   <script type="text/javascript">
       function get() {
           var date = new Date();
           document.getElementById('result').innerText = date;
       }
   </script>

Đây là cách thường được sử dụng để lấy thời gian hiện tại trên máy tính người dùng. Vì mỗi người dùng có thời gian truy cập khác nhau mà.

2.2. Khởi tạo ngày giờ từ giá trị time millisecond

JavaScript lưu trữ ngày dưới dạng số mili giây kể từ ngày 1 tháng 1 năm 1970, 00:00:00 UTC (Phối hợp theo giờ quốc tế). Đó là giờ 0 là ngày 1 tháng 1 năm 1970 00:00:00 UTC. Bây giờ là: 1640056485171 mili giây trước ngày 1 tháng 1 năm 1970

new Date(milliseconds) tạo một đối tượng ngày mới dưới dạng thời gian bằng 0 cộng với mili giây

<div>click vào button để xem kết quả</div>
<button type="button" onclick="get()">Click</button>
<p id="result"></p>
<script type="text/javascript">
    function get() {
        var date = new Date(10000000000000);
        document.getElementById('result').innerText = date;
    }
</script>

2.3. Khởi tạo ngày giờ từ một dateString

new Date(dateString) tạo một đối tượng ngày tháng mới từ một chuỗi ngày tháng. Trong đó: dateString có dạng “tháng ngày, năm giờ:phút:giây” trong đó tháng là tên tiếng anh. VD: April 06, 2017 12:00:00.

<div>click vào button để xem kết quả</div>
   <button type="button" onclick="get()">Click</button>
   <p id="result"></p>
   <script type="text/javascript">
       function get() {
           var date = new Date("April 06, 2017 12:00:00");
           document.getElementById('result').innerText = date;
       }
   </script>

2.4. Khởi tạo ngày giờ từ một date string dạng atrribute

new Date(year, month, …) tạo một đối tượng ngày mới với một ngày và giờ được chỉ định . 7 số chỉ định năm, tháng, ngày, giờ, phút, giây và mili giây (theo thứ tự đó).  Viết đầu đủ sẽ là:

new Date(year, month, day, hours, minutes, seconds, milliseconds)

<div>click vào button để xem kết quả</div>
<button type="button" onclick="get()">Click</button>
<p id="result"></p>
<script type="text/javascript">
    function get() {
        var date = new Date(2017,04,06,12,08,05,150);
        document.getElementById('result').innerText = date;
    }
</script>

Lưu ý

Trong Js các tháng sẽ từ 0 – 11 . Tháng 1 = 0 , tháng 12 = 11 .

Chỉ định một tháng cao hơn 11, sẽ không gây ra lỗi nhưng thêm phần tràn vào năm tiếp theo:

const d = new Date(2018, 15, 24, 10, 33, 30, 0);
document.write(d);

Việc chỉ định một ngày cao hơn giá trị tối đa, sẽ không gây ra lỗi nhưng sẽ thêm phần tràn vào tháng tiếp theo:

const d = new Date(2018, 05, 35, 10, 33, 30, 0);
document.write(d);

Ta cũng có thể chỉ sử dụng 6 số, 4 số, 3 số hay chỉ 2 số cũng được. Trong đó:

  • 6 số chỉ rõ năm, tháng, ngày, giờ, phút, giây
  • 5 số chỉ định năm, tháng, ngày, giờ và phút
  • 4 số chỉ định năm, tháng, ngày và giờ
  • 3 số chỉ định năm, tháng và ngày
  • 2 số chỉ định năm và tháng

Chú ý

Bạn không thể bỏ qua tháng. Nếu bạn chỉ cung cấp một tham số, nó sẽ được coi là mili giây.

Ví dụ:

const d = new Date(2018);
document.write(d);

3. Hiển thị ngày trong JavaScript

Như mình đã nói ở phần trước thì Js sẽ (theo mặc định) xuất ngày tháng ở định dạng chuỗi văn bản đầy đủ. Khi bạn hiển thị một đối tượng ngày tháng trong HTML, nó sẽ tự động được chuyển đổi thành một chuỗi với phương thức toString()

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toString();
</script>

Các phương pháp toUTCString() chuyển đổi một ngày thành một chuỗi UTC (một màn hình tiêu chuẩn ngày).

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toUTCString();
</script>

Các phương pháp toDateString() chuyển đổi một ngày sang một định dạng dễ đọc hơn.

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toDateString();
</script>

Các phương pháp toISOString()chuyển đổi một đối tượng Date thành một chuỗi, bằng cách sử dụng định dạng chuẩn ISO.

<p id="demo"></p>

<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toISOString();
</script>