Formatuj daty w JavaScript bez biblioteki: kreator Intl.DateTimeFormat na żywo, kod dla YYYY-MM-DD i MM/DD/YYYY, strefy czasowe, czas względny, zakresy oraz pułapki parsowania, przez które data przesuwa się o jeden dzień.
Aby sformatować datę w JavaScript, użyj Intl.DateTimeFormat lub toLocaleDateString z ustawieniem regionalnym i opcjami, na przykład date.toLocaleDateString("en-US", { dateStyle: "long" }) daje March 5, 2026. Używaj toISOString() dla API, opcji timeZone, aby pokazać inną strefę, i Intl.RelativeTimeFormat dla wyrażeń takich jak 3 dni temu.
Szybkie odpowiedzi
Wybierz w kreatorze ustawienie regionalne i opcje, a potem skopiuj wygenerowany kod; podgląd formatuje Twoja własna przeglądarka. Pod spodem znajdziesz tabelę codziennych formatów i działające przykłady dla stref czasowych, czasu względnego i zakresów.
Weź lokalny rok, miesiąc powiększony o jeden i dzień, uzupełnij je przez padStart(2, "0") i połącz łącznikami. toISOString().slice(0, 10) też daje taki kształt, ale w UTC, więc w okolicach północy może pokazać zły dzień.
new Date("2026-03-05") jest odczytywana jako północ UTC. Na zachód od Greenwich ten moment to lokalnie nadal 4. dzień miesiąca. Parsuj z godziną ("2026-03-05T00:00") albo przez new Date(2026, 2, 5), aby dostać lokalną północ.
Nie do formatowania. Intl obsługuje ustawienia regionalne, strefy czasowe i czas względny w każdej nowoczesnej przeglądarce. Sami opiekunowie Moment określają go jako projekt przestarzały; do obliczeń na datach dobrze sprawdza się mała biblioteka, taka jak date-fns, lub nowsze API Temporal (tam, gdzie jest dostępne).
Przekaż timeZone z nazwą IANA, na przykład { timeZone: "America/New_York", timeStyle: "short" }. Obiekt Date pozostaje tym samym momentem; zmienia się tylko sposób zapisu.
Popularne formaty i kod dla każdego z nich
Ciąg ISO z samą datą jest odczytywany jako północ UTC, ale ciąg z datą i godziną bez przesunięcia jest odczytywany jako czas lokalny. Ta różnica powoduje większość błędów z przesunięciem o jeden dzień.
Zbuduj datę z lokalnych części przez padStart. Trik z ustawieniem regionalnym en-CA daje ten sam wynik, ale zakłada, że format tego ustawienia się nie zmieni.
timeZone przyjmuje nazwę IANA. Sam Date nie ma strefy; zmienia się tylko formatowanie. Pamiętaj, że timeZoneName nie można łączyć z dateStyle ani timeStyle.
Intl.RelativeTimeFormat pisze słowa; Ty wybierasz jednostkę. Ta funkcja pomocnicza wybiera największą pasującą jednostkę.
formatRange usuwa powtarzające się części, więc rezerwacja od 5. do 9. dnia tego samego miesiąca brzmi naturalnie.
Gdy żaden gotowy styl nie pasuje, weź zlokalizowane części i ułóż je samodzielnie, na przykład aby dzień był większy niż miesiąc.
Pracujesz z sekundami epoki? Skorzystaj z
Opcje Intl.DateTimeFormat używane w kreatorze
(brak)
(Twoja strefa)
Błąd: {msg}
Data i godzina
Ustawienie regionalne
Strefa czasowa
Tryb
Gotowe style
Wybierz każdą część
Kopiuj kod
Zacznij za darmo · Bez karty kredytowej