JavaScript-datumobjekt


Innehållsförteckning

    Visa innehållsförteckning


JavaScript Datum Objects låter oss arbeta med datum:

År:

Ett exempel på att få innevarande år i Javascript:

<!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>

Månad:

Ett exempel på att få den aktuella månaden i Javascript:

<!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>

Dag:

Ett exempel på att få aktuell dag i Javascript:

<!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>

Öppettider:

Ett exempel på att få den aktuella timmen i Javascript:

<!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>

Minuter:

Ett exempel på att få den aktuella minuten i Javascript:

<!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>

sekunder:

Ett exempel på att få den nuvarande tvåan i Javascript:

<!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>

Exempel

const d = new Date();

Prova själv →

<!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");

Prova själv →

<!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>

Notera

Datumobjekt är statiska. "Klockan" "går inte".

Datorklockan tickar, datumobjekt gör det inte.


JavaScript-datumutdata

Som standard kommer JavaScript att använda webbläsarens tidszon och visa ett datum som en fullständig textsträng:

Du kommer att lära dig mycket mer om hur du visar datum senare i den här handledningen.


Skapa datumobjekt

Datumobjekt skapas med ny Date()-konstruktor.

Det finns 9 sätt att skapa ett nytt datumobjekt:

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)

JavaScript new Date()

new Date() skapar ett datumobjekt med aktuellt datum och tid:

Exempel

const d = new Date();

Prova själv →

<!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>

nytt datum(datumsträng)

new Date(date string) skapar ett datumobjekt från en datumsträng:

Exempel

const d = new Date("October 13, 2014 11:13:00");

Prova själv →

<!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");

Prova själv →

<!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>

Datumsträngsformat beskrivs i nästa kapitel.


nytt datum(år, månad, ...)

new Date(year, month, ...) skapar ett datumobjekt med ett specificerat datum och tid.

7 siffror anger år, månad, dag, timme, minut, sekund och millisekund (i den ordningen):

Exempel

const d = new Date(2018, 11, 24, 10, 33, 30, 0);

Prova själv →

<!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>

Notera

JavaScript räknar månader från 0 till 11:

Januari=0.

december=11.

Om du anger en månad högre än 11, kommer det inte att resultera i ett fel utan lägg till överflödet till nästa år:

Specificerar:

const d = new Date(2018, 15, 24, 10, 33, 30);

Prova själv →

<!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>

Är det samma som:

const d = new Date(2019, 3, 24, 10, 33, 30);

Prova själv →

<!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>

Om du anger en dag som är högre än max, resulterar det inte i ett fel, men lägger till överflödet till nästa månad:

Specificerar:

const d = new Date(2018, 5, 35, 10, 33, 30);

Är det samma som:

const d = new Date(2018, 6, 5, 10, 33, 30);

Prova själv →

<!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>

Använder 6, 4, 3 eller 2 nummer

6 siffror anger år, månad, dag, timme, minut, sekund:

Exempel

const d = new Date(2018, 11, 24, 10, 33, 30);

Prova själv →

<!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 siffror anger år, månad, dag, timme och minut:

Exempel

const d = new Date(2018, 11, 24, 10, 33);

Prova själv →

<!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 siffror anger år, månad, dag och timme:

Exempel

const d = new Date(2018, 11, 24, 10);

Prova själv →

<!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 siffror anger år, månad och dag:

Exempel

const d = new Date(2018, 11, 24);

Prova själv →

<!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 siffror anger år och månad:

Exempel

const d = new Date(2018, 11);

Prova själv →

<!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>

Du kan inte utelämna månad. Om du bara anger en parameter kommer den att behandlas som millisekunder.

Exempel

const d = new Date(2018);

Prova själv →

<!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>

Föregående århundrade

Ett och tvåsiffrigt årtal kommer att tolkas som 19xx:

Exempel

const d = new Date(99, 11, 24);

Prova själv →

<!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>

Exempel

const d = new Date(9, 11, 24);

Prova själv →

<!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 lagrar datum som millisekunder

JavaScript lagrar datum som antal millisekunder sedan 1 januari 1970.

Nolltid är 1 januari 1970 00:00:00 UTC.

En dag (24 timmar) är 86 400 000 millisekunder.

Nu är tiden:

millisekunder efter den 1 januari 1970


nytt datum(millisekunder)

new Date(milliseconds) skapar ett nytt datumobjekt som milliseconds plus nolltid:

Exempel

1 januari 1970 plus 100 000 000 000 millisekunder är:

const d = new Date(100000000000);

Prova själv →

<!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 januari 1970 minus 100 000 000 000 millisekunder är:

const d = new Date(-100000000000);

Prova själv →

<!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 januari 1970 plus 24 timmar är:

const d = new Date(24 * 60 * 60 * 1000);
// or
const d = new Date(86400000);

Prova själv →

<!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 januari 1970 plus 0 millisekunder är:

const d = new Date(0);

Prova själv →

<!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>


Datummetoder

När ett datumobjekt skapas kan du använda ett antal metoder Det.

Datummetoder låter dig få och ställa in år, månad, dag, timme, minut, sekund och millisekund av datumobjekt, med antingen lokal tid eller UTC (universell eller GMT) tid.

Datummetoder och tidszoner behandlas i nästa kapitel.


Visar datum

JavaScript kommer (som standard) att mata ut datum med metoden toString(). Detta är en strängrepresentation av datumet, inklusive tidszonen. Formatet anges i ECMAScript-specifikationen:

Exempel

Prova själv →

<!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>

När du visar ett datumobjekt i HTML konverteras det automatiskt till ett sträng, med metoden toString().

Exempel

const d = new Date();
d.toString();

Prova själv →

<!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>

Metoden toDateString() konverterar ett datum till ett mer läsbart formatera:

Exempel

const d = new Date();
d.toDateString();

Prova själv →

<!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>

Metoden toUTCString() konverterar ett datum till en sträng med UTC-standarden:

Exempel

const d = new Date();
d.toUTCString();

Prova själv →

<!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>

Metoden toISOString() konverterar ett datum till en sträng med ISO-standarden:

Exempel

const d = new Date();
d.toISOString();

Prova själv →

<!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>

Komplettera JavaScript-datumreferens

För en fullständig datumreferens, gå till vår:

Komplettera JavaScript-datumreferens.

Referensen innehåller beskrivningar och exempel på alla Date-egenskaper och metoder.