JavaScript Päivämääräobjektit antavat meille mahdollisuuden työskennellä päivämäärien kanssa:
Esimerkki kuluvan vuoden saamisesta Javascriptiin:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getFullYear() Method</h2>
<p>Return the full year of a date object:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getFullYear();
</script>
</body>
</html>
Esimerkki kuluvan kuukauden hankkimisesta Javascriptissä:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getMonth() Method</h2>
<p>Return the month of a date as a number from 0 to 11.</p>
<p>To get the correct month number, you must add 1:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getMonth() + 1;
</script>
</body>
</html>
Esimerkki nykyisen päivän hakemisesta Javascriptissä:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getDate() Method</h2>
<p>Return the day of a date as a number (1-31):</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getDate();
</script>
</body>
</html>
Esimerkki nykyisen tunnin saamisesta Javascriptissä:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getHours() Method</h2>
<p>Return the hours of a date as a number (0-23):</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getHours();
</script>
</body>
</html>
Esimerkki nykyisen minuutin saamisesta Javascriptissä:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getMinutes() Method</h2>
<p>Returns the minutes of a date as a number (0-59):</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getMinutes();
</script>
</body>
</html>
Esimerkki nykyisen toisen hankkimisesta Javascriptissä:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The getSeconds() Method</h2>
<p>Return the seconds of a date as a number (0-59):</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.getSeconds();
</script>
</body>
</html>
const d = new Date();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>new Date() without arguments, creates a date object with the current date and time:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
const d = new Date("2022-03-25");
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p id="demo"></p>
<script>
const d = new Date("2022-03-25");
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Päivämääräobjektit ovat staattisia. "Kello" ei "käy".
Tietokoneen kello tikittää, päivämääräobjektit eivät.
Oletusarvoisesti JavaScript käyttää selaimen aikavyöhykettä ja näyttää päivämäärän kokotekstimerkkijonona:
Myöhemmin tässä opetusohjelmassa opit paljon lisää päivämäärien näyttämisestä.
Päivämääräobjektit luodaan käyttämällä uusi Date()
-konstruktori.
On 9 tapaa luoda uusi päivämääräobjekti:
new Date()
new Date(date string)
new Date(year,month)
new Date(year,month,day)
new Date(year,month,day,hours)
new Date(year,month,day,hours,minutes)
new Date(year,month,day,hours,minutes,seconds)
new Date(year,month,day,hours,minutes,seconds,ms)
new Date(milliseconds)
new Date()
new Date()
luo päivämääräobjektin, jossa on nykyinen päivämäärä ja aika:
const d = new Date();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>Create a new date object with the current date and time:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
new Date(päivämäärämerkkijono)
uusi päivämäärä(päivämäärämerkkijono)
luo päivämääräobjektin päivämäärämerkkijonosta:
const d = new Date("October 13, 2014 11:13:00");
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>A date object can be created with a specified date and time:</p>
<p id="demo"></p>
<script>
const d = new Date("October 13, 2014 11:13:00");
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
const d = new Date("2022-03-25");
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p id="demo"></p>
<script>
const d = new Date("2022-03-25");
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Päivämäärämerkkijonomuodot kuvataan seuraavassa luvussa.
uusi päivämäärä(vuosi, kuukausi, ...)
uusi päivämäärä(vuosi, kuukausi, ...)
luo päivämääräobjektin, jolla on määritetty päivämäärä ja aika.
7 numeroa määrittävät vuoden, kuukauden, päivän, tunnin, minuutin, sekunnin ja millisekunnin (tässä järjestyksessä):
const d = new Date(2018, 11, 24, 10, 33, 30, 0);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>Using new Date(7 numbers), creates a new date object with the specified date and time:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
JavaScript laskee kuukausia välillä 0 - 11:
Tammikuu=0.
Joulukuu=11..
Yli 11 kuukauden määrittäminen ei aiheuta virhettä, vaan lisää ylivuodon seuraavaan vuoteen:
Määritetään:
const d = new Date(2018, 15, 24, 10, 33, 30);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript new Date()</h1>
<p>JavaScript counts months from 0 to 11.</p>
<p>Specifying a month higher than 11, will not result in an error but add the overflow to the next year:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 15, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
On sama kuin:
const d = new Date(2019, 3, 24, 10, 33, 30);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript new Date()</h1>
<p>JavaScript counts months from 0 to 11.</p>
<p id="demo"></p>
<script>
const d = new Date(2019, 3, 24, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Maksimipäivää suuremman päivän määrittäminen ei aiheuta virhettä, vaan lisää ylivuoto seuraavaan kuukauteen:
Määritetään:
const d = new Date(2018, 5, 35, 10, 33, 30);
On sama kuin:
const d = new Date(2018, 6, 5, 10, 33, 30);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>JavaScript counts months from 0 to 11.</p>
<p>Specifying a day higher than max, will not result in an error but add the overflow to the next month:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 05, 35, 10, 33, 30, 0);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
6 numeroa määrittävät vuoden, kuukauden, päivän, tunnin, minuutin, sekunnin:
const d = new Date(2018, 11, 24, 10, 33, 30);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>6 numbers specify year, month, day, hour, minute and second:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11, 24, 10, 33, 30);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
5 numeroa määrittävät vuoden, kuukauden, päivän, tunnin ja minuutin:
const d = new Date(2018, 11, 24, 10, 33);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>5 numbers specify year, month, day, hour, and minute:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11, 24, 10, 33);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
4 numeroa määrittelevät vuoden, kuukauden, päivän ja tunnin:
const d = new Date(2018, 11, 24, 10);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>4 numbers specify year, month, day, and hour:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11, 24, 10);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
3 numeroa osoittavat vuoden, kuukauden ja päivän:
const d = new Date(2018, 11, 24);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>3 numbers specify year, month, and day:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
2 numeroa osoittavat vuoden ja kuukauden:
const d = new Date(2018, 11);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>2 numbers specify year and month:</p>
<p id="demo"></p>
<script>
const d = new Date(2018, 11);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Kuukautta ei voi jättää väliin. Jos annat vain yhden parametrin, sitä käsitellään millisekunteina.
const d = new Date(2018);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>One parameter will be interpreted as new Date(milliseconds).</p>
<p id="demo"></p>
<script>
const d = new Date(2018);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Yksi- ja kaksinumeroiset vuodet tulkitaan luvuksi 19xx:
const d = new Date(99, 11, 24);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>Two digit years will be interpreted as 19xx:</p>
<p id="demo"></p>
<script>
const d = new Date(99, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
const d = new Date(9, 11, 24);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript new Date()</h2>
<p>One digit years will be interpreted as 19xx:</p>
<p id="demo"></p>
<script>
const d = new Date(9, 11, 24);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
JavaScript tallentaa päivämäärät millisekunteina 1. tammikuuta 1970 lähtien.
Nollaaika on 1. tammikuuta 1970 00:00:00 UTC.
Yksi päivä (24 tuntia) on 86 400 000 millisekuntia.
Nyt on aika:
millisekuntia 1. tammikuuta 1970 jälkeen
new Date(millisekuntia)
uusi päivämäärä (millisekuntia)
luo uuden päivämääräobjektin muodossa millisekuntia plus nolla aika:
1. tammikuuta 1970 plus 100 000 000 000 millisekuntia on:
const d = new Date(100000000000);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>100000000000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>
<script>
const d = new Date(100000000000);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
1. tammikuuta 1970 miinus 100 000 000 000 millisekuntia on:
const d = new Date(-100000000000);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>-100000000000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>
<script>
const d = new Date(-100000000000);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
1. tammikuuta 1970 plus 24 tuntia on:
const d = new Date(24 * 60 * 60 * 1000);
// or
const d = new Date(86400000);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>86400000 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>
<script>
const d = new Date(86400000);
document.getElementById("demo").innerHTML = d;
</script>
<p>One day (24 hours) is 86,400,000 milliseconds.</p>
</body>
</html>
1. tammikuuta 1970 plus 0 millisekuntia on:
const d = new Date(0);
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>0 milliseconds from January 01 1970 UTC is:</p>
<p id="demo"></p>
<script>
const d = new Date(0);
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Kun päivämääräobjekti luodaan, voit käyttää useita menetelmiä se.
Päivämäärämenetelmien avulla voit saada ja asettaa vuoden, kuukauden, päivän, tunnin, minuutti, sekunti ja millisekunti päivämääräobjekteista joko paikallista aikaa tai UTC-aikaa käyttäen (yleinen tai GMT) aika.
Päivämäärämenetelmät ja aikavyöhykkeet käsitellään seuraavissa luvuissa.
JavaScript tulostaa (oletuksena) päivämäärät toString()-menetelmällä. Tämä on merkkijonoesitys päivämäärästä, mukaan lukien aikavyöhyke. Muoto on määritetty ECMAScript-spesifikaatiossa:
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>Using new Date()</h2>
<p>new Date() without arguments, creates a date object with the current date and time:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d;
</script>
</body>
</html>
Kun näytät päivämääräobjektin HTML-muodossa, se muunnetaan automaattisesti muotoon a merkkijono toString()
-menetelmällä.
const d = new Date();
d.toString();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The toString() Method</h2>
<p>Convert a date to a string:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toString();
</script>
</body>
</html>
toDateString()
-menetelmä muuntaa päivämäärän luettavammaksi muoto:
const d = new Date();
d.toDateString();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The toDateString() Method</h2>
<p>Convert a date to a date string:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toDateString();
</script>
</body>
</html>
Menetelmä toUTCString()
muuntaa päivämäärän merkkijonoksi UTC-standardin mukaisesti:
const d = new Date();
d.toUTCString();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The toUTCString() Method</h2>
<p>Convert a date to a string using the UTC standard:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toUTCString();
</script>
</body>
</html>
Menetelmä toISOString()
muuntaa päivämäärän merkkijonoksi ISO-standardin avulla:
const d = new Date();
d.toISOString();
Kokeile itse →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Dates</h1>
<h2>The toISOString() Method</h2>
<p>Convert a date to a string using the ISO standard:</p>
<p id="demo"></p>
<script>
const d = new Date();
document.getElementById("demo").innerHTML = d.toISOString();
</script>
</body>
</html>
Täydellisen päivämääräviitteen löydät osoitteestamme:
Täydellinen JavaScript-päivämäärä.
Viite sisältää kuvauksia ja esimerkkejä kaikista Date-ominaisuuksista ja menetelmiä.