Bevezetés
A dátum és az idő nemcsak a mindennapi élet kritikus összetevői, hanem a számítógépes programozásnak is részei. Akár időpontfoglaláshoz, akár naptár megjelenítéséhez van szüksége rájuk, számos oka lehet annak, hogy miért van szüksége dátumra és időre. A dátum- és időfunkciók alkalmazási köre széleskörű és rendkívül sokoldalú. A sokoldalúság abból adódik, hogy az időt és a dátumot a felhasználó alapján konfigurálhatja. Minden különböző földrajzi helyen lévő felhasználó más-más eredményt kap az időzónája alapján. Ezeket a funkciókat olyan weboldalakon használják, amelyek időpontfoglaló felülettel és foglalási rendszerekkel rendelkeznek, mint például az éttermek.
A programozók gyakran használnak JavaScriptet a dátum- és időfunkciók weboldalukhoz való hozzáadásához. Ez azért van, mert a JavaScript már rendelkezik egy beépített funkcióval ezekre a szempontokra. Ebben az útmutatóban részletesebben megvizsgáljuk a Date objektumot. Beszélni fogunk azokról a metódusokról, amelyekkel beállíthatja a weboldalán a dátum és az idő ideális beállításait. Kitérünk arra is, hogyan változtathatja meg a formátumot és még sok másra.
Mi az a Date objektum?
Ahogy az imént említettük, a JavaScript rendelkezik egy beépített funkcióval a dátumhoz és az időhöz. Ezt Date objektumnak nevezik. Ez az objektum lehetővé teszi a dátumhoz és időhöz kapcsolódó adatok módosítását és kezelését. Amikor létrehoz egy példányt a Date számára, egy új objektum jön létre. Ez az objektum a számítógépének az adott pillanatban érvényes dátum- és időbeállításainak felel meg.
Hogy jobban megértse az objektum működését, vegyünk egy példát. Először létrehozunk egy változót. Ezután hozzárendelünk egy adott dátumot. Tegyük fel, hogy a nap szerda, a dátum pedig október 18. a londoni (GMT) időzónában. Tekintse meg ezt a konfigurációt:
|
1 2 3 4 |
// Változó beállítása a jelenlegi dátumra és időre const now = new Date(); // Kimenet megtekintése Now; |
|
1 2 3 |
Kimenet Sze Okt 18 2017 12:41:34 GMT+0000 (UTC) |
A kimenetünk egy dátum karakterláncot mutat. Ez a következő adatokból áll:
| A hét napja | Hónap | Nap | Év | Óra | Perc | Másodperc | Időzóna |
| Sze | Okt | 18 | 2017 | 12 | 41 | 34 | GMT+0000 (UTC) |
A JavaScript egy időbélyegen keresztül kapja meg az adatokat. Ez az időbélyeg a Unix-időből származik. Ez egy olyan érték, amely az 1970. január 1-je éjfél óta eltelt ezredmásodpercek számát mutatja. A felhasználó számára a dátum érthető formátumban jelenik meg. Ha meg szeretné kapni ezt az időbélyeget, a getTime() metódust kell használnia, így:
|
1 2 3 |
// A jelenlegi időbélyeg lekérése now.getTime(); |
|
1 2 3 |
Kimenet 1508330494000 |
Bár ez az érték zavarónak tűnhet, ugyanazt jelenti, mint a dátum karakterlánc. Ez egyszerűen 2017. október 18.
Mi az az Epoch idő?
A következő elsajátítandó fogalom az epoch idő. Ezt nulla időnek is nevezik. Jobban megértheti, mint a
01 január, 1970 00:00:00 univerzális idő (UTC) karakterláncot és a 0 időbélyeget. A teszteléshez hozzon létre egy új változót. Ezután rendelje hozzá egy új
Date példányhoz egy 0 időbélyegen:
|
1 2 3 4 5 |
// A 0 időbélyeg hozzárendelése egy új változóhoz const epochTime = new Date(0); epochTime; |
|
1 2 3 |
Kimenet 01 január, 1970 00:00:00 univerzális idő (UTC) |
Az epoch idő korábban a programozók szabványa volt. Ez az a módszer is, amelyet a JavaScript használ az idő mérésére.
Dátumlétrehozási formátumok a JavaScriptben
Most, hogy már tudjuk, hogyan kell új Date példányt létrehozni karakterlánccal és időbélyeggel, beszélhetünk a különböző formátumokról. Négy formátum létezik, amelyek részletezése a következő:
Ez azt jelenti, hogy szükség szerint megadhat konkrét dátumokat és időpontokat. Egyszerűen használhat egy adat karakterláncot vagy időbélyeget is, ahogy azt korábban megbeszéltük. A jobb megértés érdekében megvizsgáljuk, hogyan hozhat létre új Date objektumokat három különböző módon. Feltételezve, hogy a dátumunk és időnk 1776. július 4., délután 12:30 GMT:
|
1 2 3 4 5 6 7 8 |
// Időbélyeg módszer new Date(-6106015800000); // Dátum karakterlánc módszer new Date("July 4 1776 12:30"); // Dátum és idő módszer new Date(1776, 6, 4, 12, 30, 0, 0); |
Amint láthatja, mindhárom módszer ugyanazt a dátumot adja eredményül. Az egyik különbség az, hogy ha az Epoch idő előtti időpontot használ, az időbélyeg negatív számmal fog megjelenni. Ezenkívül a másodpercek és ezredmásodpercek alapértelmezés szerint 0 értékűek a dátum és idő módszerben. Ha elfelejt beírni egy számot, az is alapértelmezés szerint 0-ra lesz állítva.
Egy másik megtévesztő dolog, hogy a júliust a 6-os szám képviseli a 7-es helyett. Ez azért van, mert a számozás 0-val kezdődik. Tartsa szem előtt ezeket a dolgokat a példányok létrehozásakor.
A get parancs használata a dátum lekéréséhez
Most, hogy a dátum be van állítva, lássuk, hogyan érheti el az összetevőit. Az egyik módja a get parancs használata. Ez a táblázat bemutatja az összes get metódust a Date objektumhoz:
Ebben a példában egy új dátumot rendelünk egy új változóhoz, 1980. július 31-hez:
|
1 2 |
// Új születésnapi példány inicializálása const birthday = new Date(1980, 6, 31); |
Így nézne ki, ha ezzel a módszerrel kérné le az összes egyedi dátum-összetevőt:
|
1 2 3 4 5 6 7 8 9 |
birthday.getFullYear(); // 1980 birthday.getMonth(); // 6 birthday.getDate(); // 31 birthday.getDay(); // 4 birthday.getHours(); // 0 birthday.getMinutes(); // 0 birthday.getSeconds(); // 0 birthday.getMilliseconds(); // 0 birthday.getTime(); // 333849600000 (GMT szerint) |
Bizonyos helyzetekben előfordulhat, hogy a dátumnak csak egy bizonyos részére van szüksége. Erre használhatja ezeket a módszereket. Így ellenőrizheti, hogy október 3-a van-e:
|
1 2 3 4 5 6 7 8 |
// A mai dátum lekérése const today = new Date(); // A mai nap összehasonlítása október 3-ával if (today.getDate() === 3 && today.getMonth() === 9) { console.log("It's October 3rd."); } else { console.log("It's not October 3rd."); } |
|
1 2 3 |
Kimenet It's not October 3rd. |
Ezt a kimenetet kapná, ha a dátum nem október 3-a lenne, és ezt ellenőrizné.
A set parancs használata a dátum módosítására
A get parancsokhoz hasonlóan léteznek a set parancsmegfelelők is. Ez a parancs lehetővé teszi a dátum-összetevők módosítását. Ez a táblázat bemutatja az összes metódust:
Tegyük fel, hogy meg akarjuk változtatni a birthday változót erről: 1997 erre: 1980:
|
1 2 3 |
// Születésnapi dátum évének módosítása birthday.setFullYear(1997); birthday; |
|
1 2 3 |
Kimenet Thu Jul 31 1997 00:00:00 GMT+0000 (UTC) |
Most a kimenetünk az új évet mutatja. Hasonlóképpen módosíthatja a dátum többi összetevőjét is.
UTC dátummetódusok JavaScriptben
Ha a dátum-összetevőket a get metódussal kéri le, akkor azokat a felhasználó időzónájának helyi rendszerbeállításai alapján kapja meg. Alternatív megoldásként beállíthatja úgy is, hogy az időt az UTC szabvány alapján számítsa ki. Az UTC a koordinált világidőt (Coordinated Universal Time) jelenti. Ezt a getUTC metódussal teheti meg. Ez a táblázat bemutatja az összes UTC metódust a Date objektumhoz JavaScriptben:
Amint láthatja, az összes metódus hasonló a get parancsokhoz. A kimenetek azonban eltérőek lennének. Ezzel a kóddal tesztelheti a különbséget:
|
1 2 3 4 5 6 |
// Aktuális idő hozzárendelése egy változóhoz const now = new Date(); // Helyi és UTC időzónák kiíratása console.log(now.getHours()); console.log(now.getUTCHours()); |
Ez a kód megmutatja az aktuális órát, valamint az órát az UTC időzónában. A számok megegyeznek, ha már az UTC időzónában tartózkodik. Az UTC használatának oka az, hogy konzisztenciát biztosít a nemzetközi zónák és régiók között.
Összegzés
Ebben az útmutatóban bemutattuk a különböző metódusokat a Date objektumhoz. Ez magában foglalta a dátumkomponensek lekérését a get metódussal, valamint azok módosítását a set metódussal. Megvizsgáltuk az UTC időzónákat is, és azt, hogyan használhatjuk őket JavaScriptben.
Végezetül, a JavaScript rengeteg beépített funkcióval rendelkezik a dátumok és idők kezelésére. Ez meglehetősen egyszerűvé teszi az összetett weboldalak programozását. További információkat olvashat a JavaScript dátum- és időfunkcióiról a Mozilla Developer Network oldalon. Ez az útmutató azonban segít elsajátítani az alapokat.
Íme további források a blogunkról, amelyek megkönnyítik a JavaScript programozást:
- JavaScript: útmutató a karakterláncok indexeléséhez, felosztásához és manipulálásához
- Munka a JavaScripttel: Hogyan működnek a prototípusok és az öröklődés
- Útmutató a JavaScript HTML-hez való hozzáadásához
- A JSON adatmegosztási formátum áttekintése
Kellemes kódolást!
Hozzászólások
Még nincsenek hozzászólások. Legyen Ön az első.