`Date` Obiekt

Ten artykuł wyjaśnia obiekt Date.

Wyjaśnimy obiekt Date krok po kroku, od podstawowych mechanizmów do najczęściej używanych operacji w praktycznej pracy, z konkretnymi przykładami.

YouTube Video

Date Obiekt

Czym jest obiekt Date?

Obiekt Date w JavaScript to standardowy obiekt do obsługi dat i godzin. Wewnątrz zarządza datą i godziną na podstawie liczby milisekund, które upłynęły od 1 stycznia 1970, 00:00:00 UTC.

Najpierw utwórzmy obiekt Date reprezentujący bieżącą datę i czas oraz sprawdźmy jego zawartość.

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

• Ten kod tworzy obiekt Date reprezentujący aktualną datę i godzinę w momencie wykonania. Format wyświetlania zależy od środowiska uruchomieniowego, np. przeglądarki lub systemu operacyjnego.

Jak utworzyć obiekt Date

Obiekty Date można tworzyć na kilka sposobów w zależności od potrzeb. Szczególnie ważny i łatwy do pominięcia szczegół: argument month w konstruktorze jest indeksowany od zera, co oznacza, że miesiące zaczynają się od 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);

• W new Date(year, month, day), parametr month oznacza, że 0 to styczeń, a 11 to grudzień. Jeśli nie rozumiesz tej specyfikacji, możesz nieumyślnie utworzyć datę przesuniętą o jeden miesiąc, dlatego zawsze bądź ostrożny.

Pobieranie poszczególnych elementów daty i czasu

Z obiektu Date możesz indywidualnie pobrać rok, miesiąc, dzień, godzinę i dzień tygodnia. Wszystkie metody getter zwracają wartości jako liczby.

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)

• Podobnie jak przy tworzeniu, pamiętaj, że getMonth() również jest indeksowane od zera. Podczas wyświetlania zazwyczaj dodaje się 1, aby uzyskać poprawną wartość miesiąca.
• getDay() zwraca dzień tygodnia jako liczbę. 0 odpowiada niedzieli, a 6 sobocie.

Modyfikacja daty i czasu

Date to obiekt mutowalny, co oznacza, że możesz później zmieniać jego wartości. Ta właściwość jest przydatna, ale wymaga ostrożności — mogą wystąpić niezamierzone skutki uboczne.

Możesz użyć metod set, aby zmienić wartości istniejącego obiektu Date.

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

• setMonth() również jest indeksowane od zera. Oryginalny obiekt jest modyfikowany bezpośrednio.

Dodawanie i odejmowanie dat

Często wykonuje się obliczenia na datach używając milisekund lub metody setDate(). Do obliczeń opartych na dniach metoda setDate() jest szczególnie intuicyjna i bezpieczna.

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

• W tym przykładzie obliczamy datę 7 dni po podanej dacie. Nawet jeśli dodawanie przekroczy nowy miesiąc, data zostanie automatycznie skorygowana.

Porównywanie obiektów Date

Obiekty Date można porównywać jak liczby. Dzieje się tak, ponieważ porównywana jest wewnętrzna wartość w milisekundach.

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

• Jeśli chcesz określić kolejność dat, nie jest wymagana dodatkowa konwersja. Możesz bezpośrednio używać operatorów porównania.

Praca ze znacznikami czasu (milisekundy)

Date można konwertować na liczby reprezentujące milisekundy (znaczniki czasu) i odwrotnie. Ten format jest często używany w API lub integracji z bazami danych.

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

• Date.now() zwraca aktualny czas w milisekundach. Jest to bardzo przydatne, gdy chcesz przechowywać lub porównywać wartość jako liczbę.

Formatowanie dat jako łańcuchy znaków

Wyświetlanie obiektu Date bezpośrednio często prowadzi do formatu, który może nie spełniać twoich wymagań. Dlatego powinieneś jawnie sformatować datę zgodnie z własnymi wymaganiami.

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

• Ręczne formatowanie pozwala całkowicie kontrolować format wyświetlania. W praktycznej pracy do tego celu często stosuje się biblioteki.

Różnica między UTC a czasem lokalnym

Obiekt Date udostępnia metody do obsługi zarówno czasu lokalnego, jak i UTC. Właściwe rozumienie tej różnicy ma znaczenie przy integracji z serwerami i zapewnieniu kompatybilności międzynarodowej.

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

• Metody getUTC* zawsze zwracają wartości w oparciu o UTC. Bądź szczególnie ostrożny podczas przetwarzania danych z różnych stref czasowych.

Środki ostrożności przy używaniu obiektów Date

Date jest wygodny, ale ma również kilka podchwytliwych aspektów. W szczególności indeksowany od zera miesiąc i mutowalność obiektu są częstymi przyczynami błędów.

Przyjrzyjmy się konkretnym przykładom poniżej, aby zobaczyć skutki tego, że Date jest obiektem mutowalnym.

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

• Jeśli chcesz zachować oryginalną datę i czas, zawsze utwórz kopię obiektu. Sama świadomość tego aspektu pozwoli uniknąć niezamierzonych błędów.

Powody, dla których Date jest trudny w obsłudze, oraz kryteria wyboru bibliotek.

Obiekt Date oferuje wystarczające funkcje jako standardowa funkcja, ale w praktyce mogą wystąpić sytuacje, w których jest trudny w użyciu. Typowe problemy to zerowa indeksacja miesięcy i dni tygodnia, mylenie czasu lokalnego z UTC oraz fakt, że obiekt jest mutowalny. Te problemy mogą prowadzić do większej liczby błędów wraz ze wzrostem przetwarzania dat.

Date wystarcza do prostego pobierania i porównywania dat, ale czytelność i łatwość utrzymania kodu spada przy bardziej zaawansowanych obliczeniach dat lub formatowaniu wyświetlania.

Jeśli masz poniższe wymagania, warto rozważyć użycie lekkich bibliotek do obsługi dat, takich jak dayjs lub date-fns.

• Musisz jawnie obsługiwać strefy czasowe.
• Często musisz wykonywać obliczenia dat lub interwałów.
• Chcesz elastycznie zmieniać format wyświetlania.
• Chcesz obsługiwać daty i godziny w sposób niemutowalny.

Podsumowanie

Obiekty Date są najbardziej podstawowym narzędziem do obsługi daty i czasu w JavaScript. Znając jego osobliwości oraz stosując właściwe tworzenie, pobieranie, obliczenia i formatowanie, możesz bezpiecznie używać go w rzeczywistej pracy.

Po opanowaniu podstaw, korzystanie z bibliotek daty w razie potrzeby jest praktycznym wyborem.

Możesz śledzić ten artykuł, korzystając z Visual Studio Code na naszym kanale YouTube. Proszę również sprawdzić nasz kanał YouTube.

YouTube Video