js convert date to another time zone

How to Convert Date to Another Timezone in JavaScript

Sometimes you may need to convert date from one time zone to another on your web page. You can do this using plain JavaScript or third party JS libraries like moment.js. In this article, we will learn how to convert date to another timezone in JavaScript.


How to Convert Date to Another Timezone in JavaScript

By default, JavaScript converts date & time information to the browser’s local time zone. If this is not what you want, you can use the following function to easily convert a date into your desired time zone.

Using Plain JavaScript

function convertTZ(date, tzString) {
    return new Date((typeof date === "string" ? new Date(date) : date).toLocaleString("en-US", {timeZone: tzString}));   
}

In the above function, we accept the date value that we want to convert to another timezone and the new time zone. First, we check if the input date is string or date object. If it is a string, we convert it into date object. In the above function, we use toLocalString() to convert the date into a different time zone. Here is its syntax.

Date.toLocaleString(locales, options)

It is supported by most browsers.

In the above function locales argument is used to input language specific format. Options argument is used to set more properties. In the above function, we use timeZone setting in options.

Here are some examples of the above function.

// usage: Asia/Jakarta is GMT+7
convertTZ("2012/04/20 10:10:30 +0000", "Asia/Jakarta") // Tue Apr 20 2012 17:10:30 GMT+0700 (Western Indonesia Time)

// Resulting value is regular Date() object
const convertedDate = convertTZ("2012/04/20 10:10:30 +0000", "Asia/Jakarta") 
convertedDate.getHours(); // 17

// You can also put Date object to first arg
const date = new Date()
convertTZ(date, "Asia/Jakarta") // current date-time in jakarta.

Using moment.js

You can also use third-party libraries like moment.js for this purpose. Here is a simple function to help you change date to a time zone of your choice.

function toTimeZone(time, zone) {
    var format = 'YYYY/MM/DD HH:mm:ss ZZ';
    return moment(time, format).tz(zone).format(format);
}

Here is an example to use the above function.

toTimeZone("2012/04/20 10:10:30 +0000", "Asia/Jakarta")

In the above function, we use moment() function to first convert the input date to ISO format and then use tz() function to convert it into a new time zone, and finally call the format() function to convert the date into ISO format.

In this article, we have learnt a couple of simple ways to easily convert JS date into another timezone. You can easily use this as a part of a larger function or module, as per your requirement.

Also read:

How to Compare Arrays in JavaScript
How to Add Days to Date in JavaScript
How to Compare Two Dates Using JavaScript
How to Get Nested Objects Keys in JavaScript
How to Overwrite Input File in Awk

Leave a Reply

Your email address will not be published. Required fields are marked *