Den ultimative guide til JavaScript-dato og Moment.js

Velkommen til vores ultimative guide til JavaScript- Dateobjektet 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 Dateobjekt

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 Dateobjekter:

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 npmeller 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- Dateobjektet.

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- Dateobjekter 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.