How To Convert Dates To UTC In TypeScript?

I was recently working on a feature that needed to sync date and time data across users in different time zones. There, I noticed that times were showing up inconsistently depending on where the user was located. In that situation, I had to convert all dates to UTC (Coordinated Universal Time) to keep the date and time data consistent.

In this tutorial, I will explain how to convert dates to UTC (Coordinated Universal Time) in TypeScript.

Converting dates to UTC ensures that your application operates with a standardized time reference, making it easier to accurately store, compare, and display dates.

Table of Contents

Understanding UTC and Its Importance

UTC is the primary time standard by which the world regulates clocks and time. It is similar to GMT (Greenwich Mean Time) but more precise. UTC is not affected by daylight saving time changes and serves as a consistent global reference point for time coordination.

In web development, using UTC helps avoid confusion and errors arising from different time zones. When you store dates in UTC format, you can easily convert them to any desired local time zone for display purposes.

Convert Dates to UTC in TypeScript

TypeScript, being a superset of JavaScript, inherits the built-in Date object and its methods. Let’s explore different approaches to convert dates to UTC using TypeScript.

Method 1: Using the toUTCString() Method

The Date object in TypeScript provides the toUTCString() method, which returns a string representation of the date in UTC format. Here’s an example:

const localDate = new Date(2025, 2, 15, 9, 30); // March is month 2 (0-based index)
const utcString = localDate.toISOString(); // Get the UTC equivalent in ISO format

console.log("Local time:", localDate.toString());
console.log("UTC time:", utcString);  // Output: 2025-03-15T16:30:00Z

Output:

In this example, we create a localDate object representing March 15, 2025, at 9:30 AM in the local time zone. By passing the result of localDate.toUTCString() to the Date constructor, we create a new utcDate object that represents the same moment in UTC.

Check out: Convert Number to Date in TypeScript

Method 2: Using the Date.UTC() Method

TypeScript’s Date object also provides the Date.UTC() static method, which accepts parameters representing the date and time components and returns the number of milliseconds since January 1, 1970, 00:00:00 UTC. Here’s an example:

const year = 2025;
const month = 5; // June (month is zero-indexed)
const day = 15;
const hours = 9;
const minutes = 30;
const seconds = 0;

const utcMilliseconds = Date.UTC(year, month, day, hours, minutes, seconds);
const utcDate = new Date(utcMilliseconds);

console.log(utcDate); // Output: 2025-06-15T09:30:00:000Z

Output:

In this example, we provide the individual date and time components to the Date.UTC() method, which returns the number of milliseconds since the UTC epoch. We then create a new utcDate object using those milliseconds, resulting in a date object representing the specified date and time in UTC.

Check out: Check for Invalid Dates in TypeScript

Method 3: Extract UTC Components From Date in TypeScript

If you already have a date object and want to extract its UTC components, you can use the getUTC*() methods provided by the Date object. Here’s an example:

const localDate = new Date("2025-03-15T09:30:00"); // Local date and time

const utcYear = localDate.getUTCFullYear();
const utcMonth = localDate.getUTCMonth();
const utcDay = localDate.getUTCDate();
const utcHours = localDate.getUTCHours();
const utcMinutes = localDate.getUTCMinutes();
const utcSeconds = localDate.getUTCSeconds();

console.log(utcYear);    // Output: 2025
console.log(utcMonth);   // Output: 5 (June)
console.log(utcDay);     // Output: 15
console.log(utcHours);   // Output: 16
console.log(utcMinutes); // Output: 30
console.log(utcSeconds); // Output: 0

Output:

In this example, we use the various getUTC*() methods to extract the UTC components (year, month, day, hours, minutes, seconds) from the localDate object. These methods return the corresponding UTC values, allowing you to work with the date in UTC format.

Format UTC Dates in TypeScript

Once you have a date in UTC format, you may want to format it for display or storage purposes. TypeScript offers several methods to format dates, such as toISOString(), toUTCString(), and toLocaleString(). Here’s an example of formatting a UTC date using toISOString():

const utcDate = new Date("2025-06-15T13:30:00Z"); // UTC date and time
const formattedDate = utcDate.toISOString();

console.log(formattedDate); // Output: 2025-06-15T13:30:00.000Z

Output:

The toISOString() method returns a string representation of the date in ISO 8601 format, which includes the date, time, and the “Z” suffix indicating UTC.

Check out: Get the Current Date in Milliseconds Using TypeScript

Handle Time Zones For UTC Conversion in TypeScript

When working with dates and times in web applications, it’s important to consider the user’s local time zone. You can convert UTC dates to the user’s local time zone for display purposes using the toLocaleString() method. Here’s an example:

const utcDate = new Date("2025-04-15T13:30:00Z"); // UTC date and time

const localDateString = utcDate.toLocaleString("en-US", {
  timeZone: "America/New_York",
});

console.log(localDateString); // Output: 4/15/2025, 9:30:00 AM

Output:

In this example, we use the toLocaleString() method to convert the UTC date to the local date and time string based on the specified time zone (“America/New_York” in this case). The resulting string represents the date and time in the user’s local time zone.

Best Practices and Considerations

When working with dates and times in TypeScript, keep the following best practices and considerations in mind:

Always store dates in UTC format in your database or backend systems to ensure consistency and avoid time zone-related issues.
Convert dates to UTC before performing any date arithmetic or comparisons to ensure accurate results.
When displaying dates to users, convert them from UTC to the user’s local time zone for a more user-friendly experience.
Be aware of daylight saving time changes and handle them appropriately when converting between UTC and local time zones.
Use clear and descriptive variable names to differentiate between UTC and local dates to avoid confusion.

I hope you now have a clear understanding of how to convert dates to UTC in TypeScript. Keeping your dates in UTC helps avoid time zone issues and ensures data consistency.

In this tutorial, we have learned different ways to convert dates to UTC using built-in Date methods like toISOString(), Date.UTC(), and the various getUTC*() functions. We also learned how to format UTC dates and display them in a user’s local time zone using toLocaleString().