Objektet `Date`

Denna artikel förklarar objektet Date.

Vi kommer att förklara objektet Date steg för steg, från de grundläggande mekanismerna till vanliga operationer i praktiskt arbete, med konkreta exempel.

YouTube Video

Objektet Date

Vad är objektet Date?

JavaScript-objektet Date är ett standardobjekt för att hantera datum och tid. Internt hanterar det datum och tid baserat på antalet millisekunder som förflutit sedan den 1 januari 1970, 00:00:00 UTC.

Först ska vi skapa ett Date-objekt som representerar aktuellt datum och tid, och kontrollera dess innehåll.

1const now = new Date();
2console.log(now);

• Denna kod skapar ett Date-objekt som representerar det aktuella datumet och tiden vid exekveringstillfället. Visningsformatet beror på exekveringsmiljön, såsom webbläsare eller operativsystem.

Hur man skapar ett Date-objekt

Date-objekt kan skapas på flera olika sätt beroende på dina behov. En särskilt viktig punkt som är lätt att missa är att konstruktorns argument för månad är nollbaserat, vilket betyder att månader börjar på 0.

1const d1 = new Date();                     // Current date and time
2const d2 = new Date("2025-01-01");         // Create from an ISO date string
3const d3 = new Date(2025, 0, 1);           // January 1, 2025 (month is zero-based)
4const d4 = new Date(2025, 0, 1, 10, 30);   // January 1, 2025, 10:30
5
6console.log(d1, d2, d3, d4);

• I new Date(year, month, day) betyder month att 0 är januari och 11 är december. Om du inte förstår denna specifikation kan du av misstag skapa ett datum som är fel med en månad, så var alltid försiktig.

Hämta varje element av datum och tid

Du kan hämta år, månad, dag, tid och veckodag individuellt från ett Date-objekt. Alla getter-metoder returnerar värden som siffror.

1const date = new Date();
2
3console.log(date.getFullYear()); // Year
4console.log(date.getMonth());    // Month (0-based: 0 = January)
5console.log(date.getDate());     // Day of the month
6console.log(date.getHours());    // Hours
7console.log(date.getMinutes());  // Minutes
8console.log(date.getSeconds());  // Seconds
9console.log(date.getDay());      // Day of the week (0 = Sunday, 6 = Saturday)

• Var, liksom vid skapandet, uppmärksam på att getMonth() också är nollbaserad. När det används för visning är det vanligt att lägga till 1 för att justera värdet.
• getDay() returnerar veckodagen som ett nummer. 0 representerar söndag och 6 representerar lördag.

Ändra datum och tid

Date är ett muterbart objekt, vilket betyder att du kan ändra dess värden i efterhand. Denna egenskap är användbar, men du måste vara försiktig med oavsiktliga sidoeffekter.

Du kan använda set-metoder för att ändra värdena i ett befintligt Date-objekt.

1const date = new Date("2025-01-01");
2
3date.setFullYear(2026);
4date.setMonth(5);   // June
5date.setDate(15);
6
7console.log(date);

• setMonth() är också nollbaserad. Det ursprungliga objektet ändras direkt.

Addera och subtrahera datum

Det är vanligt att göra datumberäkningar med millisekunder eller genom att använda setDate(). För dagbaserade beräkningar är det särskilt intuitivt och säkert att använda setDate().

1const date = new Date("2025-01-01");
2
3date.setDate(date.getDate() + 7);
4console.log(date);

• I detta exempel beräknar vi datumet 7 dagar efter det angivna datumet. Även om additionsvärdet går in i en ny månad justeras det automatiskt.

Jämföra Date-objekt

Date-objekt kan jämföras som siffror. Detta beror på att det är det interna millisekundvärdet som jämförs.

1const a = new Date("2025-01-01");
2const b = new Date("2025-01-10");
3
4console.log(a < b);   // true
5console.log(a > b);   // false

• Om du vill bestämma ordningen på datum krävs ingen ytterligare konvertering. Du kan använda jämförelseoperatorer direkt.

Arbeta med tidsstämplar (millisekunder)

Date kan konverteras till och från siffror som representerar millisekunder (tidsstämplar). Detta format används ofta i API:er eller databas-integrationer.

1const now = Date.now();
2console.log(now);
3
4const date = new Date(now);
5console.log(date);

• Date.now() returnerar den aktuella tiden i millisekunder. Det är mycket användbart när du vill lagra eller jämföra värdet som en siffra.

Formatera datum som strängar

Att visa ett Date som det är resulterar ofta i ett format som kanske inte passar dina behov. Därför bör du uttryckligen formatera det enligt dina behov.

1const date = new Date("2025-01-01");
2
3const formatted = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
4console.log(formatted);

• Genom att formatera det manuellt på detta sätt kan du ha full kontroll över visningsformatet. I praktiskt arbete används ofta bibliotek för detta ändamål.

Skillnaden mellan UTC och lokal tid

Date erbjuder metoder för att hantera både lokal tid och UTC. Det är viktigt att förstå denna skillnad korrekt för serverintegrationer och internationell kompatibilitet.

1const date = new Date();
2
3console.log(date.getHours());    // Local time (hours)
4console.log(date.getUTCHours()); // UTC time (hours)

• getUTC*-metoderna returnerar alltid värden baserade på UTC. Var särskilt försiktig när du hanterar data över olika tidszoner.

Försiktighetsåtgärder vid användning av Date-objekt

Date är bekvämt, men har också några knepiga aspekter. Särskilt att månaden är nollbaserad och att objektet är muterbart är vanliga orsaker till buggar.

Låt oss titta på specifika exempel nedan för att se effekterna av att Date är muterbar.

1const original = new Date("2025-01-01");
2const copy = new Date(original);
3
4copy.setDate(10);
5
6console.log(original);
7console.log(copy);

• Om du vill behålla ursprungsdatumet och -tiden, skapa alltid en kopia. Bara att vara medveten om detta hjälper dig att undvika oavsiktliga buggar.

Anledningar till varför Date är svår att hantera och kriterier för att använda bibliotek

Date-objektet erbjuder tillräckliga funktioner som standard, men det finns situationer i praktiken där det kan vara svårt att använda. Typiska problem inkluderar att månader och veckodagar är nollbaserade, att man lätt förväxlar lokal tid och UTC, samt att objektet är muterbart. Dessa problem kan leda till fler buggar när hantering av datum ökar.

Date räcker för enkel inhämtning och jämförelse av datum, men kodens läsbarhet och underhållbarhet tenderar att minska med fler datumberäkningar eller formateringar av visning.

Om du har behov som de följande kan du överväga att använda lättviktiga datumbibliotek som dayjs eller date-fns.

• Du behöver hantera tidszoner explicit
• Du behöver ofta utföra datum- eller intervallberäkningar
• Du vill flexibelt kunna ändra visningsformatet
• Du vill hantera datum och tider omutabelt

Sammanfattning

Date-objekt är det mest grundläggande verktyget för att hantera datum och tid i JavaScript. Genom att förstå dess egenheter och utföra korrekt skapande, hämtning, beräkning och formatering kan du använda det tryggt i verkligt arbete.

När du behärskar grunderna är det ett praktiskt val att använda datumbibliotek vid behov.

Du kan följa med i artikeln ovan med hjälp av Visual Studio Code på vår YouTube-kanal. Vänligen kolla även in YouTube-kanalen.

YouTube Video