How to Convert Date to String Format dd/mm/yyyy in Typescript

In this Typescript tutorial, I have explained how to convert date to string format dd/mm/yyyy in Typescript using various methods with complete code.

To convert date to string format dd/mm/yyyy in Typescript, you can use various methods. One of the popular methods is by using toLocaleDateString like: function formatDateToDDMMYYYY(date: Date): string {return date.toLocaleDateString(‘en-GB’);}

Typescript convert date to string format dd/mm/yyyy

Let us discuss three different methods to convert date to string format dd/mm/yyyy in Typescript.

Convert date to string format dd/mm/yyyy using toLocaleDateString method

The toLocaleDateString method is a straightforward way to format a date in TypeScript. It converts a date to a string using the locale and options we specify. To format a date as DD/MM/YYYY, we can pass the appropriate options to this method. Here is the complete code.

function formatDateToDDMMYYYY(date: Date): string {
    return date.toLocaleDateString('en-GB');
}

const currentDate = new Date();
console.log(formatDateToDDMMYYYY(currentDate)); 

Once you run the code using any Typescript code editor, you can see the output below:

typescript convert date to string format dd/mm/yyyy

Convert date to string format dd/mm/yyyy using manual formatting

In Typescript, you can also extract the day, month, and year from the date, and then you can format it according to your requirements.

function formatDateManually(date: Date): string {
    const day = date.getDate().toString().padStart(2, '0');
    const month = (date.getMonth() + 1).toString().padStart(2, '0'); // Month is 0-indexed
    const year = date.getFullYear();

    return `${day}/${month}/${year}`;
}

const currentDate = new Date();
console.log(formatDateManually(currentDate));

You can see the output in the screenshot below after I ran the code using Visual Studio Code.

convert date to string format dd/mm/yyyy in Typescript

Convert date to string format dd/mm/yyyy using Intl.DateTimeFormat

Now, let us see how to convert the date to string format dd/mm/yyyy in Typescript using the Intl.DateTimeFormat.

See also  Typescript replace all | Typescript replace all occurrences in string

The Intl.DateTimeFormat object is a constructor for objects that enable language-sensitive date and time formatting. We can use it to format our date in the DD/MM/YYYY format.

Here is the complete code:

function formatDateWithIntl(date: Date): string {
    return new Intl.DateTimeFormat('en-GB').format(date);
}

const currentDate = new Date();
console.log(formatDateWithIntl(currentDate));

You can see the complete code to convert date to string format dd/mm/yyyy in Typescript using Intl.DateTimeFormat.

How to convert date to string format dd/mm/yyyy in Typescript

Conclusion

Converting dates to a specific string format in TypeScript is a common requirement for Typescript developers. In Typescript, you can use various methods like toLocaleDateString, manual formatting, or Intl.DateTimeFormat, etc. I hope you have an idea now of how to convert date to string format dd/mm/yyyy in Typescript.

You may also like:

>