Articles
Pengenalan kepada JavaScript
Objek `Date`

Objek `Date`

Artikel ini menerangkan tentang objek Date.

Kami akan menerangkan objek Date langkah demi langkah, daripada mekanisme asas kepada operasi yang biasa digunakan dalam kerja praktikal, dengan contoh yang konkrit.

YouTube Video

Objek Date

Apakah itu objek Date?

Objek Date dalam JavaScript ialah objek piawai untuk mengendalikan tarikh dan masa. Secara dalaman, ia mengurus tarikh dan masa berdasarkan bilangan milisaat yang berlalu sejak 1 Januari 1970, 00:00:00 UTC.

Pertama, mari kita cipta objek Date yang mewakili tarikh dan masa semasa, dan semak kandungannya.

1const now = new Date();
2console.log(now);
  • Kod ini mencipta objek Date yang mewakili tarikh dan masa semasa pada saat pelaksanaan. Format paparan bergantung pada persekitaran pelaksanaan, seperti pelayar atau sistem operasi.

Cara untuk mencipta objek Date

Objek Date boleh dicipta dengan beberapa cara bergantung kepada keperluan anda. Satu perkara penting yang sering disalah faham ialah argumen pembina untuk bulan bermula dari sifar, bermakna bulan bermula dari 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);
  • Dalam new Date(year, month, day), month bermaksud 0 ialah Januari dan 11 ialah Disember. Jika anda tidak memahami spesifikasi ini, anda mungkin tanpa sengaja mencipta tarikh yang tersilap satu bulan, jadi sentiasa berhati-hati.

Mengambil Setiap Elemen Tarikh dan Masa

Anda boleh mendapatkan tahun, bulan, hari, masa, dan hari minggu secara individu daripada objek Date. Kesemua kaedah pengambil nilai (getter) mengembalikan nilai sebagai nombor.

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)
  • Seperti semasa penciptaan, sila berhati-hati bahawa getMonth() juga bermula dari sifar. Apabila menggunakannya untuk paparan, biasanya perlu menambah 1 untuk melaraskan nilai.
  • getDay() mengembalikan hari dalam minggu sebagai nombor. 0 mewakili Ahad, dan 6 mewakili Sabtu.

Mengubah Tarikh dan Masa

Date ialah objek yang boleh diubah (mutable), bermakna anda boleh menukar nilainya kemudian. Ciri ini berguna, tetapi anda perlu berhati-hati terhadap kesan sampingan yang tidak diingini.

Anda boleh menggunakan kaedah set untuk menukar nilai dalam objek Date yang sedia ada.

1const date = new Date("2025-01-01");
2
3date.setFullYear(2026);
4date.setMonth(5);   // June
5date.setDate(15);
6
7console.log(date);
  • setMonth() juga bermula dari sifar. Objek asal akan diubah secara langsung.

Menambah dan Menolak Tarikh

Adalah biasa untuk melakukan pengiraan tarikh menggunakan milisaat atau dengan menggunakan setDate(). Untuk pengiraan berasaskan hari, menggunakan setDate() adalah cara yang paling intuitif dan selamat.

1const date = new Date("2025-01-01");
2
3date.setDate(date.getDate() + 7);
4console.log(date);
  • Dalam contoh ini, kami mengira tarikh 7 hari selepas tarikh yang ditetapkan. Walaupun penambahan melepasi ke bulan baru, ia akan dilaraskan secara automatik.

Membandingkan Objek Date

Objek Date boleh dibandingkan sebagai nombor. Ini kerana nilai milisaat dalaman yang dibandingkan.

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
  • Jika anda mahu menentukan susunan tarikh, tiada penukaran tambahan diperlukan. Anda boleh menggunakan operator perbandingan secara langsung.

Bekerja dengan Cop Masa (Milisaat)

Date boleh ditukar kepada dan daripada nombor yang mewakili milisaat (timestamp). Format ini sering digunakan dalam API atau integrasi pangkalan data.

1const now = Date.now();
2console.log(now);
3
4const date = new Date(now);
5console.log(date);
  • Date.now() mengembalikan masa semasa dalam milisaat. Ia sangat berguna apabila anda mahu menyimpan atau membandingkan nilai sebagai nombor.

Memformat Tarikh sebagai Rentetan

Memaparkan Date secara langsung selalunya akan menghasilkan format yang mungkin tidak bersesuaian dengan keperluan anda. Oleh itu, anda sepatutnya memformatkannya mengikut keperluan anda.

1const date = new Date("2025-01-01");
2
3const formatted = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
4console.log(formatted);
  • Dengan memformat secara manual seperti ini, anda boleh sepenuhnya mengawal format paparan. Dalam kerja sebenar, perpustakaan (library) sering digunakan untuk tujuan ini.

Perbezaan Antara Waktu UTC dan Waktu Tempatan

Date menyediakan kaedah untuk mengendalikan kedua-dua waktu tempatan dan UTC. Adalah penting untuk memahami perbezaan ini dengan betul bagi integrasi pelayan dan keserasian antarabangsa.

1const date = new Date();
2
3console.log(date.getHours());    // Local time (hours)
4console.log(date.getUTCHours()); // UTC time (hours)
  • Kaedah getUTC* sentiasa mengembalikan nilai berdasarkan UTC. Berhati-hati khususnya semasa memproses data merentasi zon waktu.

Langkah Berjaga-jaga Ketika Menggunakan Objek Tarikh

Date memang mudah digunakan, namun ada juga aspek yang mengelirukan. Terutamanya, konsep bulan bermula dari sifar dan kebolehubahannya adalah punca biasa pepijat (bug).

Mari lihat contoh-contoh di bawah untuk memahami kesan bahawa Date adalah boleh diubah (mutable).

1const original = new Date("2025-01-01");
2const copy = new Date(original);
3
4copy.setDate(10);
5
6console.log(original);
7console.log(copy);
  • Jika anda ingin mengekalkan tarikh dan masa asal, sentiasa buat satu salinan. Dengan hanya mengambil perhatian tentang perkara ini, anda boleh mengelakkan pepijat yang tidak dijangka.

Sebab mengapa Date sukar untuk dikendalikan dan kriteria untuk menggunakan perpustakaan

Objek Date menyediakan ciri-ciri yang mencukupi sebagai fungsi standard, tetapi terdapat situasi di mana ia sukar untuk digunakan dalam amalan. Isu biasa termasuk bulan dan hari minggu bermula dari kosong, kecenderungan mengelirukan masa tempatan dan UTC, serta fakta bahawa objek ini boleh diubah. Isu-isu ini boleh menyebabkan lebih banyak pepijat apabila pemprosesan tarikh meningkat.

Date adalah mencukupi untuk mendapatkan dan membandingkan tarikh secara ringkas, tetapi kebolehbacaan dan penyelenggaraan kod akan menurun jika terdapat lebih banyak pengiraan tarikh atau format paparan.

Jika anda mempunyai keperluan seperti berikut, anda mungkin mahu mempertimbangkan penggunaan perpustakaan tarikh yang ringan seperti dayjs atau date-fns.

  • Anda perlu mengendalikan zon masa dengan jelas
  • Anda kerap perlu melakukan pengiraan tarikh atau jarak masa
  • Anda mahu menukar format paparan dengan lebih fleksibel
  • Anda mahu mengendalikan tarikh dan masa secara tidak boleh diubah (immutable)

Ringkasan

Objek Date adalah alat yang paling asas untuk mengendalikan tarikh dan masa dalam JavaScript. Dengan memahami keunikan serta melaksanakan penciptaan, pengambilan, pengiraan, dan pemformatan yang betul, anda boleh menggunakannya dengan selamat dalam kerja sebenar.

Selepas menguasai asas, menggunakan perpustakaan tarikh mengikut keperluan adalah pilihan yang praktikal.

Anda boleh mengikuti artikel di atas menggunakan Visual Studio Code di saluran YouTube kami. Sila lihat juga saluran YouTube kami.

YouTube Video

Objek `Set`