Ο απόλυτος οδηγός για την Ημερομηνία JavaScript και το Moment.js
Καλώς ορίσατε στον απόλυτο οδηγό μας για το Date
αντικείμενο JavaScript και το Moment.js. Αυτό το σεμινάριο θα σας διδάξει όλα όσα πρέπει να γνωρίζετε για την εργασία με ημερομηνίες και ώρες στα έργα σας.
Πώς να δημιουργήσετε ένα Date
αντικείμενο
Λάβετε την τρέχουσα ημερομηνία και ώρα
const now = new Date(); // Mon Aug 10 2019 12:58:21 GMT-0400 (Eastern Daylight Time)
Λάβετε ημερομηνία και ώρα με μεμονωμένες τιμές
const specifiedDate = new Date(2019, 4, 29, 15, 0, 0, 0); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)
Η σύνταξη είναι Date(year, month, day, hour, minute, second, millisecond)
.
Σημειώστε ότι οι μήνες έχουν μηδενικό δείκτη, ξεκινώντας από τον Ιανουάριο στο 0 και τελειώνουν με τον Δεκέμβριο στις 11.
Λάβετε ημερομηνία και ώρα από μια χρονική σήμανση
const unixEpoch = new Date(0);
Αυτό αντιπροσωπεύει την ώρα την Πέμπτη, 1 Ιανουαρίου 1970 (UTC) ή την ώρα Unix Epoch. Το Unix Epoch είναι σημαντικό γιατί είναι αυτό που χρησιμοποιούν το JavaScript, το Python, το PHP και άλλες γλώσσες και συστήματα για τον υπολογισμό της τρέχουσας ώρας.
new Date(ms)
επιστρέφει την ημερομηνία της εποχής συν τον αριθμό χιλιοστών του δευτερολέπτου που περνάτε. Σε μια μέρα υπάρχουν 86.400.000 χιλιοστά του δευτερολέπτου έτσι:
const dayAfterEpoch = new Date(86400000);
θα επιστρέψει την Παρασκευή, 2 Ιανουαρίου 1970 (UTC).
Λάβετε μια ημερομηνία και ώρα από μια συμβολοσειρά
const stringDate = new Date('May 29, 2019 15:00:00'); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)
Η λήψη της ημερομηνίας με αυτόν τον τρόπο είναι πολύ ευέλικτη. Όλα τα παρακάτω παραδείγματα επιστρέφουν έγκυρα Date
αντικείμενα:
new Date('2019-06') // June 1st, 2019 00:00:00 new Date('2019-06-16') // June 16th, 2019 new Date('2019') // January 1st, 2019 00:00:00 new Date('JUNE 16, 2019') new Date('6/23/2019')
Μπορείτε επίσης να χρησιμοποιήσετε τη Date.parse()
μέθοδο για να επιστρέψετε τον αριθμό χιλιοστών του δευτερολέπτου από την εποχή (1η Ιανουαρίου 1970):
Date.parse('1970-01-02') // 86400000 Date.parse('6/16/2019') // 1560610800000
Ρύθμιση ζώνης ώρας
Όταν περνάτε μια συμβολοσειρά ημερομηνιών χωρίς να ορίσετε μια ζώνη ώρας, το JavaScript υποθέτει ότι η ημερομηνία / ώρα είναι σε UTC πριν τη μετατρέψει στη ζώνη ώρας του προγράμματος περιήγησής σας:
const exactBirthdate = new Date('6/13/2018 06:27:00'); console.log(exactBirthdate) // Wed Jun 13 2018 06:27:00 GMT+0900 (Korean Standard Time)
Αυτό μπορεί να οδηγήσει σε σφάλματα όπου η ημερομηνία που επιστρέφεται είναι πολύωρη. Για να το αποφύγετε αυτό, περάστε σε μια ζώνη ώρας μαζί με τη συμβολοσειρά:
const exactBirthdate = new Date('6/13/2018 06:27:00 GMT-1000'); console.log(exactBirthdate) // Thu Jun 14 2018 01:27:00 GMT+0900 (Korean Standard Time) /* These formats also work: new Date('6/13/2018 06:27:00 GMT-10:00'); new Date('6/13/2018 06:27:00 -1000'); new Date('6/13/2018 06:27:00 -10:00'); */
Μπορείτε επίσης να περάσετε μερικούς, αλλά όχι όλους, κωδικούς ζώνης ώρας:
const exactBirthdate = new Date('6/13/2018 06:27:00 PDT'); console.log(exactBirthdate) // Thu Jun 14 2018 01:27:00 GMT+0900 (Korean Standard Time)
Date
Μέθοδοι αντικειμένου
Συχνά δεν θα χρειαστείτε ολόκληρη την ημερομηνία, αλλά μόνο μέρος της όπως την ημέρα, την εβδομάδα ή τον μήνα. Ευτυχώς, υπάρχουν αρκετές μέθοδοι για να κάνετε ακριβώς αυτό:
const birthday = new Date('6/13/2018 06:27:39'); birthday.getMonth() // 5 (0 is January) birthday.getDate() // 13 birthday.getDay() // 3 (0 is Sunday) birthday.getFullYear() // 2018 birthday.getTime() // 1528838859000 (milliseconds since the Unix Epoch) birthday.getHours() // 6 birthday.getMinutes() // 27 birthday.getSeconds() // 39 birthday.getTimezoneOffset() // -540 (time zone offset in minutes based on your browser's location)
Κάντε Ευκολότερη την Εργασία με Ημερομηνίες με το Moment.js
Η σωστή ημερομηνία και ώρα δεν είναι μικρή δουλειά. Κάθε χώρα φαίνεται να έχει έναν διαφορετικό τρόπο μορφοποίησης ημερομηνιών και η λογιστική καταχώριση διαφορετικών ζωνών ώρας και θερινής ώρας / θερινής ώρας χρειάζεται, πολύ, πολύς χρόνος. Εκεί λάμπει το Moment.js - κάνει την ανάλυση, τη μορφοποίηση και την εμφάνιση των ημερομηνιών ένα αεράκι.
Για να ξεκινήσετε να χρησιμοποιείτε το Moment.js, εγκαταστήστε το μέσω ενός διαχειριστή πακέτων όπως npm
ή προσθέστε το στον ιστότοπό σας μέσω ενός CDN. Δείτε την τεκμηρίωση του Moment.js για περισσότερες λεπτομέρειες.
Λάβετε την τρέχουσα ημερομηνία και ώρα με το Moment.js
const now = moment();
Αυτό επιστρέφει ένα αντικείμενο με την ημερομηνία και την ώρα με βάση την τοποθεσία του προγράμματος περιήγησής σας, μαζί με άλλες τοπικές πληροφορίες. Είναι παρόμοιο με αυτό των εγγενών JavaScript new Date()
.
Λάβετε μια ημερομηνία και ώρα από μια χρονική σήμανση με το Moment.js
Παρόμοια με new Date(ms)
, μπορείτε να περάσετε τον αριθμό χιλιοστών του δευτερολέπτου από την εποχή σε moment()
:
const dayAfterEpoch = moment(86400000);
Εάν θέλετε να λάβετε μια ημερομηνία χρησιμοποιώντας μια χρονική σήμανση Unix σε δευτερόλεπτα, μπορείτε να χρησιμοποιήσετε τη unix()
μέθοδο:
const dayAfterEpoch = moment.unix(86400);
Λάβετε μια ημερομηνία και ώρα από μια συμβολοσειρά με το Moment.js
Η ανάλυση μιας ημερομηνίας από μια συμβολοσειρά με το Moment.js είναι εύκολη και η βιβλιοθήκη δέχεται συμβολοσειρές με τη μορφή ημερομηνίας ώρας ISO 8601 ή RFC 2822, μαζί με οποιαδήποτε συμβολοσειρά αποδεκτή από το Date
αντικείμενο JavaScript .
Οι συμβολοσειρές ISO 8601 συνιστώνται, καθώς είναι ευρέως αποδεκτή μορφή Ορίστε μερικά παραδείγματα:
moment('2019-04-21'); moment('2019-04-21T05:30'); moment('2019-04-21 05:30'); moment('20190421'); moment('20190421T0530');
Ορισμός ζώνης ώρας με το Moment.js
Up until now, we have been using Moment.js in local mode, meaning that any input is assumed to be a local date or time. This is similar to how the native JavaScript Date
object works:
const exactBirthMoment = moment('2018-06-13 06:27:00'); console.log(exactBirthMoment) // Wed Jun 13 2018 06:27:00 GMT+0900 (Korean Standard Time)
However, to set a time zone, you must first get the Moment object in UTC mode:
const exactBirthMoment = moment.utc('2018-06-13 06:27:00'); console.log(exactBirthMoment) // Wed Jun 13 2018 15:27:00 GMT+0900 (Korean Standard Time)
Then you can adjust for the difference in time zones with the utcOffset()
method:
const exactBirthMoment = moment.utc('2018-06-13 06:27:00').utcOffset('+10:00'); console.log(exactBirthMoment) // Wed Jun 13 2018 06:27:00 GMT+0900 (Korean Standard Time)
You can also set the UTC offset as a number or a string:
moment.utc().utcOffset(10) // Number of hours offset moment.utc().utcOffset(600) // Number of minutes offset moment.utc().utcOffset('+10:00') // Number of hours offset as a string
To use named time zones (America/Los_Angeles
) or time zone codes (PDT
) with Moment objects, check out the Moment Timezone library.
Format the date and time with Moment.js
One of the major strengths that Moment.js has over native JavaScript Date
objects is how easy it is to format the output date and time. Just chain the format()
method to a Moment date object and pass it a format string as a parameter:
moment().format('MM-DD-YY'); // "08-13-19" moment().format('MM-DD-YYYY'); // "08-13-2019" moment().format('MM/DD/YYYY'); // "08/13/2019" moment().format('MMM Do, YYYY') // "Aug 13th, 2019" moment().format('ddd MMMM Do, YYYY HH:mm:ss') // "Tues August 13th, 2019 19:29:20" moment().format('dddd, MMMM Do, YYYY -- hh:mm:ss A') // "Tuesday, August 13th, 2019 -- 07:31:02 PM"
Here's a table with some common formatting tokens:
Input | Output | Description |
---|---|---|
YYYY | 2019 | 4 digit year |
YY | 19 | 2 digit year |
MMMM | August | Full month name |
MMM | Aug | Abbreviated month name |
MM | 08 | 2 digit month |
M | 8 | 1 digit month |
DDD | 225 | Day of the year |
DD | 13 | Day of the month |
Do | 13th | Day of the month with ordinal |
dddd | Wednesday | Full day name |
ddd | Wed | Abbreviated day name |
HH | 17 | Hours in 24 hour time |
hh | 05 | Hours in 12 hour time |
mm | 32 | Minutes |
ss | 19 | Seconds |
a | am / pm | Ante or post meridiem |
A | AM / PM | Capitalized ante or post meridiem |
ZZ | +0900 | Timezone offset from UTC |
X | 1410715640.579 | Unix timestamp in seconds |
XX | 1410715640579 | Unix timestamp in milliseconds |
Ανατρέξτε στα έγγραφα Moment.js για περισσότερα διακριτικά μορφοποίησης.
Η εργασία με Date
αντικείμενα JavaScript και Moment.js δεν χρειάζεται να είναι χρονοβόρα. Τώρα θα πρέπει να γνωρίζετε περισσότερα από αρκετά για να ξεκινήσετε και με τα δύο.