Úvod
Dátum a čas sú nielen dôležitými súčasťami každodenného života, ale aj súčasťou počítačového programovania. Či už ich potrebujete na rezerváciu termínov alebo zobrazenie kalendára, existuje mnoho dôvodov, prečo by ste dátum a čas potrebovali. Využitie funkcií dátumu a času je rozsiahle a mimoriadne všestranné. Všestrannosť vyplýva zo skutočnosti, že čas a dátum môžete nakonfigurovať na základe používateľa. Každý používateľ v inej geografickej lokalite získa iný výsledok na základe svojho časového pásma. Tieto funkcie sa používajú pre webové stránky s rozhraniami na plánovanie schôdzok a rezervačnými systémami, ako sú reštaurácie.
Programátori často používajú JavaScript na pridanie funkcií dátumu a času na svoje webové stránky. Je to preto, že JavaScript už má vstavanú funkciu pre tieto aspekty. V tomto návode preskúmame Date podrobnejšie. Povieme si o metódach, ktoré môžete použiť na konfiguráciu ideálnych nastavení dátumu a času na vašom webe. Budeme sa venovať aj tomu, ako môžete zmeniť formát a ďalším veciam.
Čo je objekt Date?
Ako sme práve spomenuli, JavaScript má vstavanú funkciu pre dátum a čas. Nazýva sa Date objekt. Tento objekt vám umožňuje meniť a spravovať súvisiace údaje pre dátum a čas. Keď vytvoríte inštanciu pre Date, vytvorí sa nový objekt. Tento objekt zodpovedá nastaveniam dátumu a času vášho počítača v danom okamihu.
Aby sme lepšie pochopili fungovanie tohto objektu, uveďme si príklad. Najprv vytvoríme premennú. Potom jej priradíme daný dátum. Predpokladajme, že deň je streda a dátum je 18. október v londýnskom časovom pásme (GMT). Pozrite sa na túto konfiguráciu:
|
1 2 3 4 |
// Set variable to current date and time const now = new Date(); // View the output Now; |
|
1 2 3 |
Output Wed Oct 18 2017 12:41:34 GMT+0000 (UTC) |
Náš výstup zobrazuje reťazec dátumu. Skladá sa z nasledujúcich údajov:
| Deň v týždni | Mesiac | Deň | Rok | Hodina | Minúta | Sekunda | Časové pásmo |
| Wed | Oct | 18 | 2017 | 12 | 41 | 34 | GMT+0000 (UTC) |
JavaScript prijíma údaje prostredníctvom časovej pečiatky. Táto časová pečiatka pochádza z času Unix. Ide o hodnotu, ktorá ukazuje počet milisekúnd, ktoré uplynuli od 1. januára 1970 o polnoci. Používateľovi sa dátum zobrazuje v zrozumiteľnom formáte. Ak chcete získať túto časovú pečiatku, musíte použiť metódu getTime() takto:
|
1 2 3 |
// Get the current timestamp now.getTime(); |
|
1 2 3 |
Output 1508330494000 |
Hoci táto hodnota vyzerá mätúco, predstavuje to isté ako reťazec dátumu. Je to jednoducho 18. október 2017.
Čo je čas Epoch?
Ďalším konceptom, ktorý sa naučíme, je čas epochy. Nazýva sa tiež nulový čas. Lepšie ho pochopíte ako dátový reťazec
01 Január, 1970 00:00:00 Univerzálny Čas (UTC) a 0 časovú pečiatku. Ak to chcete otestovať, vytvorte novú premennú. Potom ju priraďte k novej inštancii
Date na 0 časovej pečiatke:
|
1 2 3 4 5 |
// Assign the timestamp 0 to a new variable const epochTime = new Date(0); epochTime; |
|
1 2 3 |
Output 01 Január, 1970 00:00:00 Univerzálny Čas (UTC) |
Čas epochy býval pre programátorov štandardom. Je to tiež metóda, ktorú JavaScript používa na meranie času.
Formáty pre vytváranie dátumu v JavaScripte
Teraz, keď už vieme, ako vytvoriť novú inštanciu Date pomocou reťazca a časovej pečiatky, môžeme hovoriť o rôznych formátoch. Existujú štyri formáty, ktoré sú podrobne opísané nasledovne:
To znamená, že podľa potreby môžete uviesť konkrétne dátumy a časy. Môžete tiež jednoducho použiť dátový reťazec alebo časovú pečiatku, ako sme už hovorili. Pre pochopenie si ukážeme, ako vytvoriť nové objekty Date tromi rôznymi spôsobmi. Predpokladajme, že náš dátum a čas je 4. júl 1776 o 12:30 GMT:
|
1 2 3 4 5 6 7 8 |
// Metóda časovej pečiatky new Date(-6106015800000); // Metóda dátového reťazca new Date("July 4 1776 12:30"); // Metóda dátumu a času new Date(1776, 6, 4, 12, 30, 0, 0); |
Ako môžete vidieť, všetky tri metódy poskytujú ako výstup rovnaký dátum. Jedným rozdielom je, že ak používate čas pred časom Epochy, časová pečiatka sa zobrazí so záporným číslom. Okrem toho sú sekundy a milisekundy v metóde dátumu a času predvolene nastavené na 0. Ak zabudnete zadať číslo, predvolene sa nastaví tiež na 0.
Ďalším mätúcim aspektom je, že júl je reprezentovaný číslom 6 namiesto 7. Je to preto, že číslovanie začína od 0. Majte tieto veci na pamäti, keď vytvárate inštancie.
Použitie príkazu get na získanie dátumu
Teraz, keď je dátum nastavený, pozrime sa, ako môžete pristupovať k jeho zložkám. Jedným zo spôsobov je použiť príkaz get. Táto tabuľka zobrazuje všetky get metódy pre Date objekt:
V tomto príklade priradíme novej premennej nový dátum, 31. júl 1980:
|
1 2 |
// Inicializácia novej inštancie narodenín const birthday = new Date(1980, 6, 31); |
Takto by to vyzeralo, keby ste pomocou tejto metódy získali všetky jednotlivé zložky dátumu:
|
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 (pre GMT) |
V niektorých situáciách môžete potrebovať iba určitú časť dátumu. Na tento účel môžete použiť tieto metódy. Tu je návod, ako môžete otestovať, či je 3. október:
|
1 2 3 4 5 6 7 8 |
// Získať dnešný dátum const today = new Date(); // Porovnať dnešok s 3. októbrom if (today.getDate() === 3 && today.getMonth() === 9) { console.log("Je 3. október."); } else { console.log("Nie je 3. október."); } |
|
1 2 3 |
Výstup Nie'je 3. október . |
To je výstup, ktorý by ste dostali, keby dátum nebol 3. október a vy by ste ho testovali.
Použitie príkazu set na úpravu dátumu
Podobne ako pri príkazoch get , máte k dispozícii protiklady set . Tento príkaz vám umožňuje upravovať zložky dátumu. Táto tabuľka zobrazuje všetky metódy:
Povedzme, že chceme zmeniť premennú birthday z 1997 na 1980:
|
1 2 3 |
// Zmeniť rok dátumu narodenia birthday.setFullYear(1997); birthday; |
|
1 2 3 |
Výstup Thu Jul 31 1997 00:00:00 GMT+0000 (UTC) |
Teraz náš výstup zobrazuje nový rok. Podobne môžete upraviť aj ostatné zložky dátumu.
Metódy dátumu UTC v JavaScripte
Ak extrahujete zložky dátumu pomocou metódy get, dostanete ich na základe lokálnych systémových nastavení časového pásma používateľa. Prípadne ho môžete nakonfigurovať tak, aby počítal čas na základe štandardu UTC. UTC znamená koordinovaný svetový čas (Coordinated Universal Time). Môžete to urobiť pomocou metódy getUTC. Táto tabuľka zobrazuje všetky metódy UTC pre objekt Date v JavaScripte:
Ako môžete vidieť, všetky metódy sú podobné príkazom get . Výstupy by však boli odlišné. Rozdiel môžete otestovať pomocou tohto kódu:
|
1 2 3 4 5 6 |
// Priradenie aktuálneho času do premennej const now = new Date(); // Výpis lokálneho a UTC časového pásma console.log(now.getHours()); console.log(now.getUTCHours()); |
Tento kód vám ukáže aktuálnu hodinu, ako aj hodinu v časovom pásme UTC. Čísla budú rovnaké, ak sa už nachádzate v časovom pásme UTC. Dôvodom, prečo by ste mali používať UTC, je to, že umožňuje konzistentnosť naprieč medzinárodnými pásmami a regiónmi.
Záver
V tomto tutoriáli sme sa venovali rôznym metódam pre Date objekt. To zahŕňalo spôsob, ako získať komponenty dátumu pomocou get a ako ich upraviť pomocou set. Preskúmali sme tiež časové pásma UTC a to, ako ich používať v JavaScripte.
JavaScript má v konečnom dôsledku množstvo vstavaných funkcií pre dátum a čas. Vďaka tomu je programovanie zložitých webových stránok pomerne jednoduché. Viac o funkciách dátumu a času v JavaScripte si môžete prečítať na Mozilla Developer Network. Tento tutoriál by vám však mal pomôcť pokryť základy.
Tu sú ďalšie zdroje z nášho blogu, ktoré vám uľahčia programovanie v JavaScripte:
- JavaScript: tutoriál o tom, ako indexovať, deliť a manipulovať s reťazcami
- Práca s JavaScriptom: Ako fungujú prototypy a dedičnosť
- Sprievodca pridaním JavaScriptu do HTML
- Prehľad formátu na zdieľanie údajov JSON
Príjemné programovanie!
Komentáre
Zatiaľ žiadne komentáre. Buďte prvý.