Sok általad létrehozott alkalmazásnak van valamilyen dátumkomponense, legyen szó erőforrás létrehozásának dátumáról vagy egy tevékenység időbélyegéről.
A dátum- és időbélyeg-formázás kezelése kimerítő lehet. Ebben az útmutatóban megtudhatja, hogyan lehet az aktuális dátumot különböző formátumokban megszerezni a JavaScript-ben.
A JavaScript dátumobjektuma
A JavaScript beépített Date
objektummal rendelkezik, amely tárolja a dátumot és az időt, és módszereket biztosít azok kezelésére.
Az Date
objektum új példányának létrehozásához használja a következő new
kulcsszót:
const date = new Date();
Az Date
objektum tartalmaz egy olyan Number
jelet, amely milliszekundumokat képvisel a korszak óta, azaz 1970. január 1-je óta.
Adhat egy dátum karakterláncot a Date
kivitelezőnek egy objektum létrehozásához a megadott dátumra:
const date = new Date('Jul 12 2011');
Az aktuális év megszerzéséhez használja getFullYear()
az Date
objektum példány metódusát . A getFullYear()
metódus a megadott dátum évét adja vissza a Date
konstruktorban:
const currentYear = date.getFullYear(); console.log(currentYear); //2020
Hasonlóképpen vannak módszerek a hónap aktuális napjának és az aktuális hónapnak a lekérésére:
const today = date.getDate(); const currentMonth = date.getMonth() + 1;
A getDate()
módszer a hónap aktuális napját adja vissza (1-31).
A getMonth()
módszer a megadott dátum hónapját adja vissza. A getMonth()
módszerrel kapcsolatban meg kell jegyezni , hogy 0-indexelt értékeket ad vissza (0-11), ahol 0 januárra, 11 pedig decemberre vonatkozik. Ezért hozzáadunk 1-et a hónap értékének normalizálásához.
Dátum most
now()
az Date
objektum statikus módszere . Ez az érték milliszekundumban adja vissza, amely a korszak óta eltelt időt reprezentálja. Az új objektum példányosítására a now()
metódusból visszatért milliszekundumokat adhatja át a Date
konstruktornak Date
:
const timeElapsed = Date.now(); const today = new Date(timeElapsed);
A dátum formázása
Az Date
objektum módszereivel a dátumot több formátumba (GMT, ISO és így tovább) formázhatja .
A toDateString()
módszer ember által olvasható formátumban adja vissza a dátumot:
today.toDateString(); // "Sun Jun 14 2020"
A toISOString()
módszer az ISO 8601 kiterjesztett formátumot követő dátumot adja vissza:
today.toISOString(); // "2020-06-13T18:30:00.000Z"
A toUTCString()
módszer UTC időzóna formátumban adja vissza a dátumot:
today.toUTCString(); // "Sat, 13 Jun 2020 18:30:00 GMT"
A toLocaleDateString()
módszer a dátumot helyfüggő formátumban adja vissza:
today.toLocaleDateString(); // "6/14/2020"
A Date
módszerekre vonatkozó teljes hivatkozást az MDN dokumentációjában találja meg .
Egyéni dátumformázó funkció
A fenti szakaszban említett formátumokon kívül az alkalmazás más formátumú lehet az adatok számára. Lehet ilyen yy/dd/mm
vagy yyyy-dd-mm
formátumú, vagy valami hasonló.
A probléma megoldása érdekében jobb lenne létrehozni egy újrafelhasználható funkciót, hogy az több projektben is használható legyen.
Tehát ebben a szakaszban hozzunk létre egy segédfunkciót, amely a függvény argumentumában megadott formátumban adja vissza a dátumot:
const today = new Date(); function formatDate(date, format) { // } formatDate(today, 'mm/dd/yy');
Az "mm", "dd", "yy" karakterláncokat ki kell cserélnie az adott hónap, nap és év értékekre az argumentumban megadott formátum karakterláncból.
Ehhez használhatja az replace()
alább látható módszert:
format.replace('mm', date.getMonth() + 1);
De ez sok módszer-láncoláshoz vezet, és megnehezíti a karbantartást, miközben megpróbálja rugalmasabbá tenni a funkciót:
format.replace('mm', date.getMonth() + 1) .replace('yy', date.getFullYear()) .replace('dd', date.getDate());
Láncolási módszerek helyett használhatja a reguláris kifejezést a replace()
módszerrel.
Először hozzon létre egy objektumot, amely az alszöveg kulcsérték-párját és annak megfelelő értékét fogja képviselni:
const formatMap = { mm: date.getMonth() + 1, dd: date.getDate(), yy: date.getFullYear().toString().slice(-2), yyyy: date.getFullYear() };
Ezután használja a reguláris kifejezést a karakterláncok egyezéséhez és cseréjéhez:
formattedDate = format.replace(/mm|dd|yy|yyy/gi, matched => map[matched]);
A teljes funkció így néz ki:
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]) }
Az időbélyegek formázásának lehetőségét is hozzáadhatja a függvényhez.
Következtetés
Remélem, hogy most jobban megértette az Date
objektumot a JavaScript-ben. Ön is használja más, harmadik fél könyvtárak, mint a datesj
és moment
a fogantyú dátumokat az alkalmazásban.
Legközelebb maradjon biztonságban, és folytassa a nyüzsgést.