Végső útmutató a JavaScript-dátumhoz és a Moment.js-hez

Üdvözöljük a JavaScript Dateobjektum és a Moment.js végső útmutatójában . Ez az oktatóanyag megtanít mindent, amit tudnia kell a projektek dátumával és időpontjával való munkáról.

DateObjektum létrehozása

Szerezd meg az aktuális dátumot és időt

const now = new Date(); // Mon Aug 10 2019 12:58:21 GMT-0400 (Eastern Daylight Time)

Szerezzen dátumot és időpontot egyedi értékekkel

const specifiedDate = new Date(2019, 4, 29, 15, 0, 0, 0); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)

A szintaxis az Date(year, month, day, hour, minute, second, millisecond).

Ne feledje, hogy a hónapok nulla indexelésűek, januártól kezdődnek 0-tól és december 11-ig végződnek.

Szerezzen dátumot és időt egy időbélyegből

const unixEpoch = new Date(0);

Ez az 1970. január 1-jei csütörtök (UTC) vagy a Unix-korszak idejét jelenti. A Unix korszak azért fontos, mert ezt használja a JavaScript, a Python, a PHP és más nyelvek és rendszerek az aktuális idő kiszámításához.

new Date(ms) visszaadja a korszak dátumát, valamint az átadott milliszekundumok számát. Egy nap alatt 86 400 000 milliszekundum van így:

const dayAfterEpoch = new Date(86400000);

visszatér 1970. január 2-án, pénteken (UTC).

Szerezzen be egy dátumot és időpontot egy karakterláncból

const stringDate = new Date('May 29, 2019 15:00:00'); // Wed May 29 2019 15:00:00 GMT-0400 (Eastern Daylight Time)

A dátum ilyen módon történő megszerzése nagyon rugalmas. Az alábbi összes példa érvényes Dateobjektumokat ad vissza :

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')

A Date.parse()módszer segítségével visszatérhet a milliszekundumok száma a korszak (1970. január 1.) óta:

Date.parse('1970-01-02') // 86400000 Date.parse('6/16/2019') // 1560610800000

Időzóna beállítása

Ha a dátum karakterláncát időzóna beállítása nélkül adja át, a JavaScript feltételezi, hogy a dátum / idő UTC-ben van, mielőtt átalakítja azt a böngésző időzónájába:

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)

Ez hibákhoz vezethet, amikor a visszaküldött dátum sok órával kikapcsol. Ennek elkerülése érdekében adjon meg egy időzónát a karakterlánccal együtt:

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'); */

Adhat át néhány, de nem minden időzónát:

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 Objektum módszerek

Gyakran nem a teljes dátumra lesz szükséged, hanem annak csak egy részére, például a napra, a hétre vagy a hónapra. Szerencsére erre számos módszer létezik:

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)

Tegye könnyebbé a dátumokkal való munkát a Moment.js segítségével

A dátumok és időpontok helyes beállítása nem kis feladat. Úgy tűnik, hogy minden országban más és más a dátum formázása, és a különböző időzónák és a nyári időszámítás / nyári időszámítás elszámolása nagyon sok időt vesz igénybe. Itt ragyog a Moment.js - szellősebbé teszi a dátum elemzését, formázását és megjelenítését.

A Moment.js használatának megkezdéséhez telepítse egy hasonló csomagkezelőn keresztül npm, vagy vegye fel a webhelyére CDN-en keresztül. További részletek a Moment.js dokumentációjában találhatók.

Szerezze be az aktuális dátumot és időt a Moment.js segítségével

const now = moment();

Ez egy olyan objektumot ad vissza, amelyen a böngésző helye alapján dátum és idő található, valamint egyéb területi információk. Hasonló a natív JavaScript-ekhez new Date().

Szerezzen dátumot és időt egy időbélyegből a Moment.js segítségével

Ehhez hasonlóan new Date(ms)átadhatja a korszak óta eltelt milliszekundumok számát moment():

const dayAfterEpoch = moment(86400000);

Ha másodpercek alatt szeretne időpontot kapni a Unix időbélyegző használatával, használhatja a unix()módszert:

const dayAfterEpoch = moment.unix(86400);

Szerezzen be egy dátumot és időt egy stringből a Moment.js segítségével

A Moment.js segítségével egyszerű elemezni a dátumot egy karaktersorozatból, és a könyvtár elfogadja az ISO 8601 vagy az RFC 2822 dátum és idő formátumú karaktersorozatokat, a JavaScript Dateobjektum által elfogadott karaktersorozatokkal együtt .

Az ISO 8601 karakterláncok használata ajánlott, mivel széles körben elfogadott formátum. Íme néhány példa:

moment('2019-04-21'); moment('2019-04-21T05:30'); moment('2019-04-21 05:30'); moment('20190421'); moment('20190421T0530');

Időzóna beállítása a Moment.js segítségével

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

See the Moment.js docs for more formatting tokens.

Working with JavaScript Date objects and Moment.js doesn't have to be time consuming. Now you should know more than enough to get started with both.