W tym artykule dowiemy się o różnych sposobach formatowania obiektu Date na różne ciągi dat w różnych formatach przy użyciu JavaScript.

Zobaczymy metody formatowania obiektów Date na różne ciągi dat w różnych formatach przy użyciu JavaScript. Niezależnie od tego, czy tworzysz aplikację internetową, manipulujesz danymi, czy po prostu wyświetlasz daty, opanowanie tych technik umożliwi Ci prezentowanie dat w formacie, który najlepiej odpowiada Twoim potrzebom. Przyjrzyjmy się wszechstronności formatowania daty w JavaScript.

Poniższa lista zawiera różne sposoby formatowania daty w JavaScript:

Spis treści

• Metoda 1: Użycie metody toDateString().
• Metoda 2: Użycie metody toISOString().
• Metoda 3: Użycie metody toLocaleDateString().
• Metoda 4: Użycie metody toLocaleString().
• Metoda 5: Użycie metody obiektowej Intl.DateTimeFormat().
• Metoda 6: Ręczne formatowanie daty przy użyciu metod Date

Metoda 1: Użycie metody toDateString().

The toDateString() metoda formatuje obiekt daty do formatu czytelnego dla człowieka jako Dzień Miesiąc Data Rok.

Składnia:

dateObj.toDateString(); 

Przykład: Poniższy przykład kodu wyjaśnia użycie metody toDateString() do formatowania daty.

const currentDate = new Date(); const formattedDate = currentDate.toDateString(); console.log(formattedDate); 

Fri Dec 29 2023 

Metoda 2: Użycie metody toISOString().

The toISOString(). sformatuje dane zgodnie z międzynarodowymi standardami zgodnie z formatem ISO 8601.

Składnia:

dateObj.toISOString(); 

Przykład: Poniższy przykład kodu implementuje metodę toISOString() w celu sformatowania obiektu daty.

const currentDate = new Date(); const formattedDate = currentDate.toISOString(); console.log(formattedDate); 

2023-12-29T09:39:27.634Z 

Metoda 3: Użycie metody toLocaleDateString().

toLocaleDateString() metoda sformatuje część daty obiektu daty w tym samym formacie, jaki uzyskał Twój system lub w określonym formacie.

Składnia:

dateObj.toLocaleDateString();

Przykład: Poniższy przykład kodu konwertuje datę do formatu uzyskanego przez Twój system.

const currentDate = new Date(); const formattedLocalDate = currentDate.toLocaleDateString(); const formattedInSpecifiedFormat = currentDate.toLocaleDateString("hi-IN"); console.log(formattedLocalDate); console.log(formattedInSpecifiedFormat); 

12/29/2023 29/12/2023 

Metoda 4: Użycie metody toLocaleString().

toLocaleString(). będzie działać w podobny sposób, jak działa toLocaleDateString(). Jedyna różnica polega na tym, że zwraca również czas ze sformatowanym ciągiem znaków.

Składnia:

dateObj.toLocaleString();

Przykład: Poniższy przykład wykorzystuje metodę toLocaleString() do formatowania daty.

const currentDate = new Date(); const formattedLocalDate = currentDate.toLocaleString(); const formattedInSpecifiedFormat = currentDate.toLocaleString("hi-IN"); console.log(formattedLocalDate); console.log(formattedInSpecifiedFormat); 

12/29/2023, 9:39:27 AM 29/12/2023, 9:39:27 am 

Metoda 5: Użycie metody obiektowej Intl.DateTimeFormat().

Metoda obiektu Intl.DateTimeFormat(). to potężna metoda obiektowa do formatowania obiektu daty. Formatuje datę do określonego formatu i z określonymi opcjami formatowania daty i godziny.

Składnia:

const formatObj = new Intl.DateTimeFormat('en-US'); formatObj.format(dateObj); 

Przykład: Poniższy przykład formatuje obiekt daty przy użyciu metody obiektowej intl.DateTimeFormat().

const currentDate = new Date(); const dateTimeFormatter = new Intl.DateTimeFormat("en-US", {dateStyle: 'long'}); const formattedDate = dateTimeFormatter.format(currentDate); console.log(formattedDate); 

December 29, 2023 

Metoda 6: Ręczne formatowanie daty przy użyciu metod Date

W tym podejściu użyjemy różnych metod dat, aby uzyskać dzień, datę, miesiąc i rok obiektu daty, a następnie połączyć je w celu utworzenia sformatowanego ciągu znaków daty.

Przykład: Poniższy przykład kodu wykorzystuje różne metody daty, aby uzyskać datę i ją sformatować.

const weekDays =  ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']; const monthsArr =  ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; const currentDateObj = new Date(); const currentDay = weekDays[currentDateObj.getDay()]; const currentDate = currentDateObj.getDate(); const currentMonth = monthsArr[currentDateObj.getMonth()]; const currentYear = currentDateObj.getFullYear(); console.log(`${currentDay} ${currentDate} ${currentMonth}, ${currentYear}`); 

Fri 29 Dec, 2023