JavaScript - Format Tanggal: Panduan Pemula

Hai teman-teman pengembang JavaScript yang bersemangat! Hari ini, kita akan melihat dunia menarik format tanggal di JavaScript. Jangan khawatir jika Anda belum pernah menulis baris kode sebelumnya - saya akan menjadi panduan ramah bagi Anda dalam perjalanan ini, sama seperti yang saya lakukan untuk ribuan murid selama tahun-tahun mengajar saya. Jadi, ambillah secangkir kopi (atau teh, jika itu yang Anda sukai), dan mari kita mulai!

JavaScript - Date Formats

Apa Itu Format Tanggal?

Sebelum kita masuk ke kode, mari kita bicarakan apa sebenarnya format tanggal itu. Pikirkan mereka sebagai cara-cara berbeda untuk mewakili momen khusus dalam waktu. Seperti bagaimana Anda mungkin mengatakan "1 April 2023" atau "1/4/23" untuk merujuk pada tanggal yang sama, komputer juga memiliki berbagai cara untuk mengungkapkan tanggal.

Di JavaScript, kita memiliki objek Date bawaan yang membantu kita bekerja dengan tanggal dan waktu. Itu seperti memiliki kalender super cerdas di dalam kode kita!

Format Tanggal Umum di JavaScript

Mari kita lihat beberapa format tanggal yang paling umum Anda temui:

1. Format Tanggal ISO

Ini adalah format standar yang digunakan secara internasional. Itu terlihat seperti ini: "YYYY-MM-DD".

let hariIni = new Date();
console.log(hariIni.toISOString().split('T')[0]);

Dalam contoh ini, new Date() membuat objek tanggal untuk tanggal dan waktu saat ini. Kemudian kita konversi ke format ISO dan pisahkan untuk mendapatkan hanya bagian tanggal. Jika Anda menjalankan ini pada 1 April 2023, Anda akan melihat: "2023-04-01".

2. Format Tanggal Pendek

Ini adalah format yang lebih kompak: "MM/DD/YYYY".

let hariIni = new Date();
console.log(hariIni.toLocaleDateString('en-US'));

Ini akan mengeluarkan sesuatu seperti "4/1/2023" untuk 1 April 2023.

3. Format Tanggal Panjang

Format ini menyebutkan bulan: "Month DD, YYYY".

let hariIni = new Date();
console.log(hariIni.toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }));

Ini akan memberikan Anda sesuatu seperti "Saturday, April 1, 2023".

Membuat Objek Tanggal

Sekarang kita sudah melihat beberapa format, mari kita lihat berbagai cara untuk membuat objek tanggal:

1. Tanggal dan Waktu Saat Ini

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

Ini membuat objek tanggal untuk momen saat ini.

2. Tanggal dan Waktu Tertentu

let ulangTahun = new Date('1990-05-15T13:30:00');
console.log(ulangTahun);

Ini membuat objek tanggal untuk 15 Mei 1990, pukul 1:30 PM.

3. Menggunakan Komponen Individual

let Natal = new Date(2023, 11, 25); // Catatan: bulan diindeks 0
console.log(Natal);

Ini membuat objek tanggal untuk 25 Desember 2023 (ingat, di JavaScript, bulan diindeks 0, jadi 11 mewakili Desember).

Menggunakan Tanggal

Sekarang kita tahu bagaimana membuat tanggal, mari kita lihat beberapa operasi umum:

1. Mendapatkan Komponen Tanggal

let hariIni = new Date();
console.log("Tahun:", hariIni.getFullYear());
console.log("Bulan:", hariIni.getMonth() + 1); // +1 karena bulan diindeks 0
console.log("Hari:", hariIni.getDate());
console.log("Jam:", hariIni.getHours());
console.log("Menit:", hariIni.getMinutes());
console.log("Detik:", hariIni.getSeconds());

Ini akan mengeluarkan setiap komponen dari tanggal dan waktu saat ini.

2. Memformat Tanggal

JavaScript menyediakan beberapa metode untuk memformat tanggal:

let tanggal = new Date('2023-04-01T12:00:00');

console.log(tanggal.toDateString()); // "Sat Apr 01 2023"
console.log(tanggal.toTimeString()); // "12:00:00 GMT+0000 (Coordinated Universal Time)"
console.log(tanggal.toLocaleString()); // "4/1/2023, 12:00:00 PM"
console.log(tanggal.toLocaleDateString()); // "4/1/2023"
console.log(tanggal.toLocaleTimeString()); // "12:00:00 PM"

Setiap metode ini memberikan Anda representasi berbeda dari tanggal yang sama.

Tabel Metode Tanggal

Berikut adalah tabel metode Date yang umum:

Metode Deskripsi Contoh
getFullYear() Mendapatkan tahun (4 digit) date.getFullYear() // 2023
getMonth() Mendapatkan bulan (0-11) date.getMonth() // 3 (untuk April)
getDate() Mendapatkan hari dalam bulan (1-31) date.getDate() // 1
getDay() Mendapatkan hari dalam minggu (0-6) date.getDay() // 6 (untuk Sabtu)
getHours() Mendapatkan jam (0-23) date.getHours() // 12
getMinutes() Mendapatkan menit (0-59) date.getMinutes() // 0
getSeconds() Mendapatkan detik (0-59) date.getSeconds() // 0
toDateString() Konversi tanggal ke string yang dapat dibaca date.toDateString() // "Sat Apr 01 2023"
toTimeString() Konversi waktu ke string yang dapat dibaca date.toTimeString() // "12:00:00 GMT+0000 (Coordinated Universal Time)"

Kesimpulan

Dan begitu, teman-teman! Kita telah melakukan perjalanan melalui dunia format tanggal di JavaScript, dari membuat objek tanggal hingga memformat mereka dalam berbagai cara. Ingat, bekerja dengan tanggal mungkin terlihat sulit pada awalnya, tapi dengan latihan, Anda akan menjadikan mereka seperti biasa dalam waktu singkat.

Seperti yang saya selalu katakan kepada murid-murid saya, kunci untuk memahami konsep pemrograman adalah untuk eksperimen. Cobalah contoh ini, ubah mereka, dan lihat apa yang terjadi. Jangan takut untuk membuat kesalahan - itu biasanya tempat belajar terbaik terjadi!

Teruslah mengoding, teruslah belajar, dan terutama, bersenang-senanglah dengan itu. Sebelum Anda mengetahui, Anda akan menjadi orang yang menjelaskan format tanggal kepada teman Anda (meskipun mereka mungkin tidak ingin mendengarnya)!

Credits: Image by storyset