Jak formátovat datum v JavaScriptu?

V tomto článku se seznámíme s různými způsoby formátování objektu Date do různých datových řetězců různých formátů pomocí JavaScriptu.

Uvidíme způsoby formátování objektů Date do různých datových řetězců s různými formáty pomocí JavaScriptu. Ať už vytváříte webovou aplikaci, manipulujete s daty nebo jednoduše zobrazujete data, zvládnutí těchto technik vám umožní prezentovat data ve formátu, který nejlépe vyhovuje vašim potřebám. Pojďme prozkoumat všestrannost formátování data v JavaScriptu.

Níže uvedený seznam obsahuje různé způsoby formátování data v JavaScriptu:

Obsah

Metoda 1: Použití metody toDateString().

The metoda toDateString(). formátuje objekt data do formátu čitelného pro člověka jako Den Měsíc Datum Rok.

Syntax:

dateObj.toDateString(); 

Příklad: Níže uvedený příklad kódu vysvětluje použití metody toDateString() k formátování data.

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

Výstup
Fri Dec 29 2023 

Metoda 2: Použití metody toISOSTring().

The metoda toISOSTring(). zformátuje data do mezinárodních norem podle formátu ISO 8601.

Syntax:

dateObj.toISOString(); 

Příklad: Níže uvedený příklad kódu implementuje metodu toISOSTring() pro formátování objektu data.

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

Výstup
2023-12-29T09:39:27.634Z 

Metoda 3: Použití metody toLocaleDateString().

metoda toLocaleDateString(). naformátuje datovou část objektu data do stejného formátu, jaký získal váš systém, nebo do určeného formátu.

Syntax:

dateObj.toLocaleDateString();

Příklad: Níže uvedený příklad kódu převede datum do formátu získaného vaším systémem.

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

Výstup
12/29/2023 29/12/2023 

Metoda 4: Použití metody toLocaleString().

metoda toLocaleString(). bude fungovat podobně jako toLocaleDateString() . Jediný rozdíl je v tom, že také vrací čas s formátovaným řetězcem.

Syntax:

dateObj.toLocaleString();

Příklad: Níže uvedený příklad používá k formátování data metodu toLocaleString().

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

Výstup
12/29/2023, 9:39:27 AM 29/12/2023, 9:39:27 am 

Metoda 5: Použití objektové metody Intl.DateTimeFormat().

Metoda objektu Intl.DateTimeFormat(). je výkonná objektová metoda pro formátování objektu data. Formátuje datum do zadaného formátu a se zadanými možnostmi formátování data a času.

Syntax:

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

Příklad: Níže uvedený příklad formátuje objekt data pomocí objektové metody intl.DateTimeFormat().

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

Výstup
December 29, 2023 

Metoda 6: Ruční formátování data pomocí metod Date

V tomto přístupu použijeme různé metody data k získání dne, data, měsíce a roku objektu data a poté je spojíme do formátu formátovaného řetězce data.

Příklad: Níže uvedený příklad kódu používá různé metody data k získání data a jeho formátování.

Javascript
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}`); 

Výstup
Fri 29 Dec, 2023