JavaScript Datum in Čas

Objekti JavaScript Date (slo. Datum) predstavljajo en sam trenutek v formatu, neodvisnem od platforme. Objekti Date (slo. Datum) zajemajo integralno število, ki predstavlja milisekunde od polnoči na začetku 1. januarja 1970, UTC. Datum v JavaScript je v osnovi določen kot čas v milisekundah. Ta časovni žig je neodvisen od časovnega pasu in enolično definira trenutek v zgodovini. Največji časovni žig, ki ga lahko predstavlja objekt Date je nekoliko manjši od največjega varnega celega števila.

PRIMER

<!DOCTYPE html>
<html lang="sl">
<head>
    <meta charset="UTF-8">
    <title>JavaScript Datum in Čas</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>

<style>
    .prikaz-datuma {
        padding: 20px;
        border-radius: 8px;
        margin: 20px 0;
    }

    .prikaz-casa {
        padding: 15px;
        border-radius: 6px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        margin: 15px 0;
    }

    .ura-element {
        font-size: 1.5em;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .casovni-gumbi {
        margin: 15px 0;
    }

    .demo-gumb {
        background: #3498db;
        color: white;
        border: none;
        padding: 8px 15px;
        border-radius: 4px;
        margin-right: 10px;
        cursor: pointer;
        transition: background 0.3s;
    }

    .demo-gumb:hover {
        background: #2980b9;
    }

    .info-datum {
        margin-top: 20px;
        padding-top: 15px;
        border-top: 1px solid #eee;
    }
</style>
<body>
<div class="prikaz-datuma">
    <h4>Osnovni primer Date objekta:</h4>
    <div class="demo-rezultat" id="osnovniDatum"></div>

    <h4>Interaktivna ura:</h4>
    <div class="prikaz-casa">
        <div id="ura" class="ura-element"></div>
        <div id="datum" class="datum-element"></div>
    </div>

    <div class="casovni-gumbi">
        <button onmousedown="shraniInPrikaziUTC()" onmouseup="povrniPrejsnjoVrednost()"
                onmouseleave="povrniPrejsnjoVrednost()" class="demo-gumb">Prikaži UTC čas</button>
        <button onclick="prikaziLokalni()" class="demo-gumb">Prikaži lokalni čas</button>
        <button onmousedown="shraniInPrikaziCasovniZig()" onmouseup="povrniPrejsnjoVrednost()"
                onmouseleave="povrniPrejsnjoVrednost()" class="demo-gumb">Prikaži časovni žig</button>
    </div>

    <div class="info-datum">
        <p><strong>Opomba:</strong> Date objekt omogoča delo z datumi in časom. Zgornji primer prikazuje:</p>
        <ul>
            <li>Osnovni Date objekt</li>
            <li>Živo uro, ki se posodablja vsako sekundo</li>
            <li>Različne formate prikaza (UTC, lokalni čas, časovni žig)</li>
        </ul>
    </div>
</div>

<script>
    // Nastavitev osnovnega prikaza trenutnega datuma
    document.getElementById("osnovniDatum").innerHTML = "Trenutni datum: " + new Date().toLocaleString("sl-SI");

    // Globalne spremenljivke za upravljanje intervala in stanja
    let intervalId = null;
    let jeUraAktivna = true;

    // Funkcija za posodabljanje ure in datuma
    function posodobiUro() {
        const zdaj = new Date();
        // Nastavitve za format prikaza datuma in časa
        const moznosti = {
            weekday: "long",
            year: "numeric",
            month: "long",
            day: "numeric",
            hour: "2-digit",
            minute: "2-digit",
            second: "2-digit",
            hour12: false
        };

        // Posodobi prikaz ure samo če je aktivna
        if (jeUraAktivna) {
            document.getElementById("ura").innerHTML = zdaj.toLocaleTimeString("sl-SI", {
                hour: "2-digit",
                minute: "2-digit",
                second: "2-digit",
                hour12: false
            });

            document.getElementById("datum").innerHTML = zdaj.toLocaleDateString("sl-SI", {
                weekday: "long",
                year: "numeric",
                month: "long",
                day: "numeric"
            });
        }
    }

    // Zaženi intervalno posodabljanje ure
    function zacniUro() {
        jeUraAktivna = true;
        if (intervalId === null) {
            intervalId = setInterval(posodobiUro, 1000);
        }
        posodobiUro();
    }

    // Ustavi posodabljanje ure
    function ustaviUro() {
        jeUraAktivna = false;
        if (intervalId !== null) {
            clearInterval(intervalId);
            intervalId = null;
        }
    }

    // Funkcija za prikaz UTC časa med držanjem gumba
    function shraniInPrikaziUTC() {
        ustaviUro();
        const zdaj = new Date();
        document.getElementById("ura").innerHTML = zdaj.toUTCString();
    }

    // Funkcija za prikaz časovnega žiga med držanjem gumba
    function shraniInPrikaziCasovniZig() {
        ustaviUro();
        document.getElementById("ura").innerHTML = "Časovni žig: " + Date.now();
    }

    // Funkcija za povrnitev na običajni prikaz ure
    function povrniPrejsnjoVrednost() {
        zacniUro();
    }

    // Funkcija za ročni prikaz lokalnega časa
    function prikaziLokalni() {
        zacniUro();
    }

    // Začetni zagon ure
    zacniUro();
</script>
</body>
</html>

REZULTAT

Objekt Date lahko predstavlja največ 8.640.000.000.000.000 milisekund ali sto milijonov dni. To je razpon od 20. aprila 271821 pr. n. št. do 13. septembra 275760 našega štetja. Vsak poskus predstavitve časa zunaj tega obsega ima za posledico objekt Date z vrednostjo časovnega žiga NaN, kar je neveljaven datum. JavaScript bo privzeto uporabil časovni pas brskalnika in prikazal datum kot celotni besedilni niz.

Ustvarjanje in delo z datumskimi objekti

JavaScript omogoča ustvarjanje datumskih objektov na več načinov: s trenutnim datumom, iz niza, iz posameznih vrednosti (leto, mesec, dan) ali iz milisekund. Vsak datumski objekt ima številne metode za pridobivanje in nastavljanje posameznih komponent datuma in časa.

Metode za delo z datumom in časom

Za delo z datumi in časom v JavaScriptu so na voljo različne metode, razdeljene v več kategorij:

Statične metode za ustvarjanje in pretvorbo datumov (now, parse, UTC).
Metode za pridobivanje posameznih komponent datuma (dan, mesec, leto, ura, minute, sekunde).
Metode za nastavljanje posameznih komponent datuma in časa.
Metode za delo z UTC (univerzalnim koordiniranim časom).
Metode za pretvorbo datuma v različne formate niza.

Pregled metod za datum in čas

Spodnja tabela prikazuje vse glavne metode in lastnosti objekta Date v JavaScriptu, razvrščene po kategorijah (ustvarjanje, pridobivanje, nastavljanje, UTC, pretvorbe). Za vsako metodo so navedeni opis delovanja, sintaksa in konkreten primer kode.

Ime	Opis	Sintaksa	Primer
new Date()	Ustvari nov datumski objekt s trenutnim datumom in časom.	`new Date()`	`let zdaj = new Date();`
new Date(niz)	Ustvari datumski objekt iz datumskega niza.	`new Date("niz")`	`let d = new Date("2024-01-15");`
new Date(leto, mesec, ...)	Ustvari datumski objekt iz posameznih vrednosti (mesec je 0-11).	`new Date(leto, mesec, dan, ura, min, sek, ms)`	`let d = new Date(2024, 0, 15, 10, 30, 0);`
new Date(ms)	Ustvari datumski objekt iz milisekund od 1. januarja 1970.	`new Date(milisekunde)`	`let d = new Date(1705312200000);`
Date.now()	Vrne število milisekund od 1. januarja 1970.	`Date.now()`	`let ms = Date.now();`
Date.parse()	Razčleni datumski niz in vrne milisekunde od 1. januarja 1970.	`Date.parse("niz")`	`let ms = Date.parse("2024-01-15");`
Date.UTC()	Vrne milisekunde od 1. januarja 1970 po UTC času.	`Date.UTC(leto, mesec, dan)`	`let ms = Date.UTC(2024, 0, 15);`
getDate()	Vrne dan v mesecu (1–31).	`datum.getDate()`	`let dan = zdaj.getDate();`
getDay()	Vrne dan v tednu (0=nedelja, 6=sobota).	`datum.getDay()`	`let danTedna = zdaj.getDay();`
getFullYear()	Vrne leto (4 števke).	`datum.getFullYear()`	`let leto = zdaj.getFullYear();`
getHours()	Vrne ure (0–23).	`datum.getHours()`	`let ure = zdaj.getHours();`
getMilliseconds()	Vrne milisekunde (0–999).	`datum.getMilliseconds()`	`let ms = zdaj.getMilliseconds();`
getMinutes()	Vrne minute (0–59).	`datum.getMinutes()`	`let min = zdaj.getMinutes();`
getMonth()	Vrne mesec (0=januar, 11=december).	`datum.getMonth()`	`let mesec = zdaj.getMonth();`
getSeconds()	Vrne sekunde (0–59).	`datum.getSeconds()`	`let sek = zdaj.getSeconds();`
getTime()	Vrne milisekunde od 1. januarja 1970.	`datum.getTime()`	`let ms = zdaj.getTime();`
getTimezoneOffset()	Vrne razliko med UTC in lokalnim časom v minutah.	`datum.getTimezoneOffset()`	`let odstopanje = zdaj.getTimezoneOffset();`
setDate()	Nastavi dan v mesecu (1–31).	`datum.setDate(dan)`	`zdaj.setDate(15);`
setFullYear()	Nastavi leto (lahko tudi mesec in dan).	`datum.setFullYear(leto)`	`zdaj.setFullYear(2025);`
setHours()	Nastavi ure (0–23).	`datum.setHours(ura)`	`zdaj.setHours(14);`
setMilliseconds()	Nastavi milisekunde (0–999).	`datum.setMilliseconds(ms)`	`zdaj.setMilliseconds(500);`
setMinutes()	Nastavi minute (0–59).	`datum.setMinutes(min)`	`zdaj.setMinutes(30);`
setMonth()	Nastavi mesec (0–11).	`datum.setMonth(mesec)`	`zdaj.setMonth(5);`
setSeconds()	Nastavi sekunde (0–59).	`datum.setSeconds(sek)`	`zdaj.setSeconds(0);`
setTime()	Nastavi datum v milisekundah od 1. januarja 1970.	`datum.setTime(ms)`	`zdaj.setTime(1705312200000);`
getUTCDate()	Vrne dan v mesecu po UTC (1–31).	`datum.getUTCDate()`	`let dan = zdaj.getUTCDate();`
getUTCDay()	Vrne dan v tednu po UTC (0–6).	`datum.getUTCDay()`	`let dan = zdaj.getUTCDay();`
getUTCFullYear()	Vrne leto po UTC.	`datum.getUTCFullYear()`	`let leto = zdaj.getUTCFullYear();`
getUTCHours()	Vrne ure po UTC (0–23).	`datum.getUTCHours()`	`let ure = zdaj.getUTCHours();`
getUTCMilliseconds()	Vrne milisekunde po UTC (0–999).	`datum.getUTCMilliseconds()`	`let ms = zdaj.getUTCMilliseconds();`
getUTCMinutes()	Vrne minute po UTC (0–59).	`datum.getUTCMinutes()`	`let min = zdaj.getUTCMinutes();`
getUTCMonth()	Vrne mesec po UTC (0–11).	`datum.getUTCMonth()`	`let mesec = zdaj.getUTCMonth();`
getUTCSeconds()	Vrne sekunde po UTC (0–59).	`datum.getUTCSeconds()`	`let sek = zdaj.getUTCSeconds();`
setUTCDate()	Nastavi dan v mesecu po UTC.	`datum.setUTCDate(dan)`	`zdaj.setUTCDate(15);`
setUTCFullYear()	Nastavi leto po UTC.	`datum.setUTCFullYear(leto)`	`zdaj.setUTCFullYear(2025);`
setUTCHours()	Nastavi ure po UTC.	`datum.setUTCHours(ura)`	`zdaj.setUTCHours(14);`
setUTCMilliseconds()	Nastavi milisekunde po UTC.	`datum.setUTCMilliseconds(ms)`	`zdaj.setUTCMilliseconds(500);`
setUTCMinutes()	Nastavi minute po UTC.	`datum.setUTCMinutes(min)`	`zdaj.setUTCMinutes(30);`
setUTCMonth()	Nastavi mesec po UTC.	`datum.setUTCMonth(mesec)`	`zdaj.setUTCMonth(5);`
setUTCSeconds()	Nastavi sekunde po UTC.	`datum.setUTCSeconds(sek)`	`zdaj.setUTCSeconds(0);`
toString()	Vrne datum kot niz.	`datum.toString()`	`zdaj.toString(); // "Mon Jan 15 2024 ..."`
toDateString()	Vrne samo datumski del kot niz.	`datum.toDateString()`	`zdaj.toDateString(); // "Mon Jan 15 2024"`
toTimeString()	Vrne samo časovni del kot niz.	`datum.toTimeString()`	`zdaj.toTimeString(); // "10:30:00 GMT+0100"`
toISOString()	Vrne datum v ISO 8601 formatu.	`datum.toISOString()`	`zdaj.toISOString(); // "2024-01-15T09:30:00.000Z"`
toUTCString()	Vrne datum kot UTC niz.	`datum.toUTCString()`	`zdaj.toUTCString(); // "Mon, 15 Jan 2024 09:30:00 GMT"`
toLocaleDateString()	Vrne datum v lokalnem formatu.	`datum.toLocaleDateString()`	`zdaj.toLocaleDateString(); // "15. 1. 2024"`
toLocaleTimeString()	Vrne čas v lokalnem formatu.	`datum.toLocaleTimeString()`	`zdaj.toLocaleTimeString(); // "10:30:00"`
toLocaleString()	Vrne datum in čas v lokalnem formatu.	`datum.toLocaleString()`	`zdaj.toLocaleString(); // "15. 1. 2024, 10:30:00"`
toJSON()	Vrne datum kot JSON niz (enako ISO format).	`datum.toJSON()`	`zdaj.toJSON(); // "2024-01-15T09:30:00.000Z"`
valueOf()	Vrne osnovno vrednost (milisekunde).	`datum.valueOf()`	`zdaj.valueOf(); // 1705312200000`
constructor	Vrne funkcijo, ki je ustvarila prototip objekta Date.	`datum.constructor`	`zdaj.constructor; // function Date() { ... }`
Date.prototype	Omogoča dodajanje lastnosti in metod objektu Date.	`Date.prototype.novaMetoda = function() { ... }`	`Date.prototype.pozdrav = function() { return this.getFullYear(); };`

JavaScript Datum in Čas

Ustvarjanje in delo z datumskimi objekti

Metode za delo z datumom in časom

Pregled metod za datum in čas

Vadnica.org

Povezave

Podpora