Banyak aplikasi yang anda bina akan mempunyai semacam komponen tarikh, sama ada tarikh penciptaan sumber, atau cap waktu aktiviti.
Berurusan dengan format tarikh dan cap waktu boleh meletihkan. Dalam panduan ini, anda akan belajar bagaimana mendapatkan tarikh terkini dalam pelbagai format dalam JavaScript.
Objek Tarikh JavaScript
JavaScript mempunyai Dateobjek bawaan yang menyimpan tarikh dan waktu dan menyediakan kaedah untuk mengatasinya.
Untuk membuat contoh baru Dateobjek, gunakan newkata kunci:
const date = new Date();The Dateobjek mengandungi Numberyang mewakili milisaat berlalu sejak Epoch, iaitu 1 Januari 1970.
Anda boleh meneruskan rentetan tarikh kepada Datekonstruktor untuk membuat objek untuk tarikh yang ditentukan:
const date = new Date('Jul 12 2011');Untuk mendapatkan tahun semasa, gunakan getFullYear()kaedah contoh Dateobjek. The getFullYear()Cara mengembalikan tahun bagi satu tarikh yang dinyatakan dalam Datepembina:
const currentYear = date.getFullYear(); console.log(currentYear); //2020Begitu juga, ada kaedah untuk mendapatkan hari semasa bulan dan bulan semasa:
const today = date.getDate(); const currentMonth = date.getMonth() + 1; The getDate()Cara mengembalikan hari semasa bulan (1-31).
The getMonth()Cara mengembalikan bulan bagi satu tarikh yang ditetapkan. Satu perkara yang perlu diperhatikan mengenai getMonth()kaedah ini adalah bahawa ia mengembalikan nilai-indeks 0 (0-11) di mana 0 adalah untuk Januari dan 11 untuk bulan Disember. Oleh itu penambahan 1 untuk menormalkan nilai bulan.
Tarikh sekarang
now()adalah kaedah statik Dateobjek. Ia mengembalikan nilai dalam milisaat yang mewakili masa yang berlalu sejak Epoch. Anda boleh melewati milisaat yang dikembalikan dari now()kaedah ke Datekonstruktor untuk mewujudkan Dateobjek baru :
const timeElapsed = Date.now(); const today = new Date(timeElapsed);Memformat Tarikh
Anda boleh memformat tarikh menjadi beberapa format (GMT, ISO, dan sebagainya) menggunakan kaedah Dateobjek.
The toDateString()Cara mengembalikan tarikh dalam format yang boleh dibaca manusia:
today.toDateString(); // "Sun Jun 14 2020"The toISOString()Cara mengembalikan tarikh yang mengikuti Format ISO 8601 Extended:
today.toISOString(); // "2020-06-13T18:30:00.000Z"The toUTCString()Cara mengembalikan tarikh dalam format zon waktu UTC:
today.toUTCString(); // "Sat, 13 Jun 2020 18:30:00 GMT"The toLocaleDateString()Cara mengembalikan tarikh dalam format kawasan sensitif:
today.toLocaleDateString(); // "6/14/2020"Anda boleh mendapatkan rujukan lengkap untuk Datekaedah dalam dokumentasi MDN.
Fungsi Pembentuk Tarikh Tersuai
Selain format yang disebutkan di bahagian di atas, aplikasi anda mungkin memiliki format data yang berbeza. Mungkin dalam bentuk yy/dd/mmatau yyyy-dd-mmformat, atau yang serupa.
Untuk mengatasi masalah ini, lebih baik membuat fungsi yang dapat digunakan kembali sehingga dapat digunakan di beberapa projek.
Jadi di bahagian ini, mari buat fungsi utiliti yang akan mengembalikan tarikh dalam format yang ditentukan dalam argumen fungsi:
const today = new Date(); function formatDate(date, format) { // } formatDate(today, 'mm/dd/yy');Anda perlu mengganti rentetan "mm", "dd", "yy" dengan nilai bulan, hari dan tahun masing-masing dari rentetan format yang disertakan dalam argumen.
Untuk melakukan itu, anda boleh menggunakan replace()kaedah seperti yang ditunjukkan di bawah:
format.replace('mm', date.getMonth() + 1);Tetapi ini akan menyebabkan banyak kaedah rantai dan menjadikannya sukar untuk dijaga ketika anda berusaha menjadikan fungsinya lebih fleksibel:
format.replace('mm', date.getMonth() + 1) .replace('yy', date.getFullYear()) .replace('dd', date.getDate());Daripada kaedah merantai, anda boleh menggunakan ungkapan biasa dengan replace()kaedah tersebut.
Pertama buat objek yang akan mewakili pasangan kunci-nilai dari substring dan nilai masing-masing:
const formatMap = { mm: date.getMonth() + 1, dd: date.getDate(), yy: date.getFullYear().toString().slice(-2), yyyy: date.getFullYear() };Seterusnya, gunakan ungkapan biasa untuk memadankan dan mengganti rentetan:
formattedDate = format.replace(/mm|dd|yy|yyy/gi, matched => map[matched]);Fungsi lengkap kelihatan seperti ini:
function formatDate(date, format) { const map = { mm: date.getMonth() + 1, dd: date.getDate(), yy: date.getFullYear().toString().slice(-2), yyyy: date.getFullYear() } return format.replace(/mm|dd|yy|yyy/gi, matched => map[matched]) }Anda juga dapat menambahkan kemampuan untuk memformat cap waktu dalam fungsi.
Kesimpulannya
Saya harap anda sekarang lebih memahami Dateobjek dalam JavaScript. Anda juga boleh menggunakan perpustakaan pihak ketiga lain seperti datesjdan momentuntuk menangani tarikh dalam aplikasi anda.
Sehingga lain kali, selamat dan terus bergegas.