Typescript Date Format | How to Format Date in Typescript

Do you want to know about the Typescript date format? I have explained how to formate date in Typescript in this tutorial with various examples.

With the complete Typescript code, I will show the below examples:

  • Typescript date format dd-mm-yyyy
  • Typescript date format yyyy-mm-dd
  • Typescript format date mm/dd/yyyy with time
  • Typescript format date mm/dd/yyyy

You can use the Date object to format date and time in Typescript. By using various formatting options, you can display the date in Typescript. Here are a few examples with the complete code.

TypeScript Date Format dd-mm-yyyy

If you want to format a date in dd-mm-yyyy in Typescript, check the Typescript code below.

The DD-MM-YYYY format is widely used in many countries and is often preferred for its clarity. In TypeScript, formatting a date to this style involves converting the date object into a string and rearranging its components.

Here is a complete example of formatting date in dd-mm-yyyy in Typescript.

function formatDate(date: Date): string {
    const day = date.getDate().toString().padStart(2, '0');
    const month = (date.getMonth() + 1).toString().padStart(2, '0');
    const year = date.getFullYear();
    return `${day}-${month}-${year}`;
}

const today = new Date();
console.log(formatDate(today));

Here, you can see the output after I ran the code using Visual Studio code.

typescript date format dd-mm-yyyy

TypeScript Date Format yyyy-mm-dd

The YYYY-MM-DD format is ISO standard and is often used in various Typescript programs.

You can use the below code if you want to format the date in yyyy-mm-dd format in Typescript.

function formatISODate(date: Date): string {
    const year = date.getFullYear();
    const month = (date.getMonth() + 1).toString().padStart(2, '0');
    const day = date.getDate().toString().padStart(2, '0');
    return `${year}-${month}-${day}`;
}

const today = new Date();
console.log(formatISODate(today));

Here is the output; you can see the screenshot below.

typescript date format yyyy-mm-dd

TypeScript Format Date mm/dd/yyyy with time

Sometimes, we need not just the date but also the time. The MM/DD/YYYY with time format is particularly useful in scenarios where you want to get the date with time in Typescript.

See also  Typescript convert string to keyof [4 examples]

Here is the complete code to format a date in mm/dd/yyyy with time in Typescript.

function formatDate(date: Date): string {
    const day = date.getDate().toString().padStart(2, '0');
    const month = (date.getMonth() + 1).toString().padStart(2, '0');
    const year = date.getFullYear();
    return `${day}-${month}-${year}`;
}
function formatDateTime(date: Date): string {
    const formattedDate = formatDate(date); // Reuse formatDate function
    const hours = date.getHours().toString().padStart(2, '0');
    const minutes = date.getMinutes().toString().padStart(2, '0');
    const seconds = date.getSeconds().toString().padStart(2, '0');
    return `${formattedDate} ${hours}:${minutes}:${seconds}`;
}

const now = new Date();
console.log(formatDateTime(now));

Here, I have also reused the formatDate function. Check the screenshot below for the output; I ran the code using VS code.

TypeScript Format Date mm/dd/yyyy with time

TypeScript Date Format mm/dd/yyyy

The MM/DD/YYYY format is predominantly used in the United States and is familiar to a wide audience. Formatting dates in this style in TypeScript is straightforward and efficient and below is the complete code.

function formatUSDate(date: Date): string {
    const month = (date.getMonth() + 1).toString().padStart(2, '0');
    const day = date.getDate().toString().padStart(2, '0');
    const year = date.getFullYear();
    return `${month}/${day}/${year}`;
}

const today = new Date();
console.log(formatUSDate(today));

Here is the output of the above typescript code to format the date in mm/dd/yyyy format in Typescript.

typescript format date mm/dd/yyyy

Conclusion

In this Typescript tutorial, I have explained how to format a date in Typescript, and then we also cover the below Typescript date format examples:

  • TypeScript Date Format dd-mm-yyyy
  • TypeScript Date Format yyyy-mm-dd
  • TypeScript Format Date mm/dd/yyyy with time
  • TypeScript Date Format mm/dd/yyyy

You may also like:

>