formatDate – Datoformatering / Date formatting

Om funksjonen

Kanonisk navn: formatDate
Synonymer: datoformat, klokkeslett, datetime, day heading, Intl.DateTimeFormat, time zone formatting
Kategori: formattering, dato
ARIA-mønster: Ikke aktuelt - Ren dato-/tidsformatering til tekst, uten DOM, interaksjon eller eget UI-mønster.
Native-first-vurdering: Bruker Intl.DateTimeFormat internt for både dato, tidspunkt og dagsoverskrifter - dette er allerede native-first uten ekstern datolib.
Nettleserstøtte: Bruker Date og Intl.DateTimeFormat, inkludert timeZone-opsjonen for klokkeslett. Ingen egen fallback utover retur av tom streng/Ikke datert ved manglende eller ugyldig input.
Sist endret: 20. september 2026
Brukt: 5 steder

Formål

Formatterer dato og klokkeslett med Intl.DateTimeFormat og støtter eksplisitt timeZone når visningen skal følge en bestemt tidssone.

Egner seg for

Brukervendt visning av datoer, klokkeslett og dagsoverskrifter som skal følge brukerens locale eller en valgt tidssone.

Egner seg ikke for

Ikke for maskinlesbare formater, sorteringsnøkler eller streng inputvalidering. formatDate og formatDateTime sender verdien rett til new Date(...), mens formatDayHeading krever eksakt YYYY-MM-DD.

Signatur(er)

formatDate(dateStr: string, locale?: string) => string

Parameter	Type	Beskrivelse
`dateStr`	`string`	Dato/tidsverdi som sendes rett til `new Date(...)`.
`locale` (valgfri)	`string`	Overstyrer hvilket locale `Intl.DateTimeFormat` skal bruke.

Returnerer: Kort dato (f.eks. "1. jan. 2026"). Returnerer "" for tom/manglende input.

import {formatDate, formatDateTime, formatDayHeading} from "/designsystem/funksjoner/formattering/format-date/format-date.js";

formatDate("2026-01-01");                               // "1. jan. 2026"
formatDateTime("2026-01-01T10:00:00Z", "Europe/Oslo"); // "1. jan. 2026, 11:00"
formatDayHeading("2026-01-01");                         // "torsdag 1. januar 2026"

formatDateTime(dateStr: string, timeZone?: string, locale?: string) => string

Parameter	Type	Beskrivelse
`dateStr`	`string`	Dato/tidsverdi som sendes rett til `new Date(...)`.
`timeZone` (valgfri)	`string`	IANA-tidssonen klokkeslettet skal vises i.
`locale` (valgfri)	`string`	Overstyrer hvilket locale `Intl.DateTimeFormat` skal bruke.

Returnerer: Dato og klokkeslett i angitt tidssone. Returnerer "" for tom/manglende input.

formatTime(dateStr: string, timeZone?: string, locale?: string) => string

Parameter	Type	Beskrivelse
`dateStr`	`string`	Dato/tidsverdi som sendes rett til `new Date(...)`.
`timeZone` (valgfri)	`string`	IANA-tidssonen klokkeslettet skal vises i.
`locale` (valgfri)	`string`	Overstyrer hvilket locale `Intl.DateTimeFormat` skal bruke.

Returnerer: Klokkeslett (f.eks. "14:20"). Returnerer "" for tom/manglende input.

formatDayHeading(dayKey: string, locale?: string) => string

Parameter	Type	Beskrivelse
`dayKey`	`string`	Ren `YYYY-MM-DD`-dagsnøkkel; funksjonen legger til `T00:00:00` før parsing slik at datoen tolkes i lokal tid, ikke UTC.
`locale` (valgfri)	`string`	Overstyrer hvilket locale `Intl.DateTimeFormat` skal bruke.

Returnerer: Full ukedag og dato til bruk som overskrift for en dag-gruppe (f.eks. "torsdag 1. januar 2026"). Returnerer "Ikke datert" hvis input ikke matcher eksakt YYYY-MM-DD.

Prøv selv

Rediger uttrykket under - returverdien oppdateres live.

Tilgjengelighet

Ikke relevant: ren logikk uten DOM eller UI.

Referanser

Se også:

../format-varighet/index.html - Begge formaterer tidsrelatert informasjon for visning i lister, tidslinjer og detaljer.
../format-currency/index.html - Søsterfunksjon i samme formatteringskategori, men for pengebeløp i stedet for dato/tid.
../../oppslag/timezone-list/index.html - Leverer gyldige IANA-tidssoner som passer direkte inn i formatDateTime(...).
../../bilde/exif/index.html - readExif() kan gi en Date som ofte formateres videre for brukergrensesnittet.

Brukes av:

turer/js/features/receipts/receipts.js
turer/js/features/timeline/timeline.js
turer/js/features/header/header.js
turer/js/features/status/status.js
turer/js/pages/dashboard.js

Avhengigheter: Ingen