Den ultimative guide til JavaScript-dato og Moment.js
Velkommen til vores ultimative guide til JavaScript- Date
objektet og Moment.js. Denne vejledning lærer dig alt hvad du behøver at vide om at arbejde med datoer og tidspunkter i dine projekter.
Sådan oprettes et Date
objekt
Få den aktuelle dato og tid
const now = new Date(); // Mon Aug 10 2019 12:58:21 GMT-0400 (Eastern Daylight Time)
Få en dato og et klokkeslæt med individuelle værdier
const specifiedDate = new Date(2019, 4, 29, 15, 0, 0, 0); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)
Syntaksen er Date(year, month, day, hour, minute, second, millisecond)
.
Bemærk, at månederne er nulindekseret, der begynder med januar kl. 0 og slutter med december kl. 11.
Få en dato og et klokkeslæt fra et tidsstempel
const unixEpoch = new Date(0);
Dette repræsenterer tiden torsdag den 1. januar 1970 (UTC) eller Unix Epoch-tiden. Unix Epoch er vigtig, fordi det er, hvad JavaScript, Python, PHP og andre sprog og systemer bruger internt til at beregne den aktuelle tid.
new Date(ms)
returnerer datoen for epoken plus antallet af millisekunder, du passerer ind. På en dag er der 86.400.000 millisekunder, så:
const dayAfterEpoch = new Date(86400000);
vender tilbage fredag den 2. januar 1970 (UTC).
Få en dato og et klokkeslæt fra en streng
const stringDate = new Date('May 29, 2019 15:00:00'); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)
At få datoen på denne måde er meget fleksibel. Alle eksemplerne nedenfor returnerer gyldige Date
objekter:
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')
Du kan også bruge Date.parse()
metoden til at returnere antallet af millisekunder siden epoken (1. januar 1970):
Date.parse('1970-01-02') // 86400000 Date.parse('6/16/2019') // 1560610800000
Indstilling af en tidszone
Når du sender en datostreng uden at indstille en tidszone, antager JavaScript, at datoen / klokkeslættet er i UTC, før det konverteres til din browsers tidszone:
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)
Dette kan føre til fejl, hvor den returnerede dato er slået fra med mange timer. For at undgå dette skal du passere i en tidszone sammen med strengen:
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'); */
Du kan også videregive nogle, men ikke alle, tidszonkoder:
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
Objektmetoder
Ofte har du ikke brug for hele datoen, men bare en del af den som dagen, ugen eller måneden. Heldigvis er der en række metoder til netop det:
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)
Gør arbejdet med datoer lettere med Moment.js
At få datoer og tidspunkter rigtige er ikke en lille opgave. Hvert land ser ud til at have en anden måde at formatere datoer på, og det tager meget tid at tage højde for forskellige tidszoner og sommertid. Det er her, Moment.js skinner - det gør parsing, formatering og visning af datoer til en leg.
For at begynde at bruge Moment.js skal du installere det via en pakkehåndtering som npm
eller tilføje det til dit websted via et CDN. Se Moment.js-dokumentationen for flere detaljer.
Få den aktuelle dato og tid med Moment.js
const now = moment();
Dette returnerer et objekt med datoen og klokkeslættet baseret på din browsers placering sammen med andre lokale oplysninger. Det ligner native JavaScript new Date()
.
Få en dato og et klokkeslæt fra et tidsstempel med Moment.js
På samme måde kan new Date(ms)
du overføre antallet af millisekunder siden epoken til moment()
:
const dayAfterEpoch = moment(86400000);
Hvis du vil få en dato ved hjælp af et Unix-tidsstempel på få sekunder, kan du bruge unix()
metoden:
const dayAfterEpoch = moment.unix(86400);
Få en dato og et klokkeslæt fra en streng med Moment.js
Det er let at analysere en dato fra en streng med Moment.js, og biblioteket accepterer strenge i formatet ISO 8601 eller RFC 2822 Date Time sammen med enhver streng, der accepteres af JavaScript- Date
objektet.
ISO 8601-strenge anbefales, da det er et bredt accepteret format. Her er nogle eksempler:
moment('2019-04-21'); moment('2019-04-21T05:30'); moment('2019-04-21 05:30'); moment('20190421'); moment('20190421T0530');
Indstilling af en tidszone med 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 |
Se Moment.js-dokumenterne for flere formateringstokens.
Arbejde med JavaScript- Date
objekter og Moment.js behøver ikke at være tidskrævende. Nu skal du vide mere end nok til at komme i gang med begge dele.