1

I need to convert a local timezone to Pacific/Los angeles.

Example, if user in Hawaii

Code: taken here from https://stackoverflow.com/a/54127122/15358601

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

convertTZ(new Date(), "America/Los_Angeles")

Sun Mar 14 2021 17:01:59 GMT-1000 (Hawaii-Aleutian Standard Time) {}

It still prints the final with Hawaii. I need America/Los Angeles Display, not Hawaii. (however it still prints the correct new Hours and Minutes, just the Display label is incorrect) How can this be done?

Results picture

The solution should work for other timezones also, printing it respectively its other timezone, eg: America/New_York, Europe/London, Europe/Paris, etc ,

MarkAllen4512
  • 99
  • 1
  • 1
  • 9
  • are you looking for library like https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/resolvedOptions ? – Dhara Mar 15 '21 at 01:04
  • hi @Dhara if Mozilla is standardized and will work in Chrome, Edge, and Angular 11 with no issues, I'm open to it, thanks – MarkAllen4512 Mar 15 '21 at 01:07

3 Answers3

5

A few things:

  • The approach in the answer you linked to for the convertTZ is flawed. One should not parse the output of toLocalString with the Date constructor. Please read the comments following that answer.

  • The Date object can not be converted to another time zone, because it is not actually in any time zone. The only thing encapsulated by the Date object is its Unix timestamp, which can be seen with .valueOf(), .getTime(), or any mechanism that coerces it to a Number. Such values are always UTC-based.

  • When you see local time or a time zone coming from the Date object, the system's local time zone is applied to the internal UTC-based Unix Timestamp to create the output. The local time zone cannot be changed programmatically from JavaScript (or TypeScript), nor can it be altered on a per-object basis.

  • Instead of trying to convert a Date object in one time zone to a Date object in another time zone, recognize that all Date objects are inherently UTC. Thus, you can create a string that is in a different time zone, (for example, using toLocaleString with the timeZone option) but you cannot create a new Date object from that string. If you want an object that can actually be set to a different time zone, consider Luxon. If you need a solution without a library, you will one day be able to use a ZonedDateTime from the TC39 Temporal Proposal, which will eventually be part of ECMAScript.

  • Beware of calling console.log on a Date object. Neither the ECMAScript spec nor the WhatWG Console spec defines the behavior of such a call. It is undefined behavior. In some environments, the string output logged is the same as calling .toString() on the Date object - which will give the local time equivalent of the Date object's timestamp, along with a display name for the local time zone. Other environments will show the same output of calling .toISOString(), which will give an ISO-8601 representation of the timestamp in UTC. Instead of logging Date objects, call one of those two functions yourself and log the output.

Matt Johnson-Pint
  • 230,703
  • 74
  • 448
  • 575
  • thanks this is really helpful, one last question, does this answer account for Daylight savings time? https://stackoverflow.com/a/54127122/15358601 return new Date((typeof date === "string" ? New Date(date) : date).toLocaleString("en-US", {timeZone: tzString})); – MarkAllen4512 Mar 16 '21 at 15:31
  • `toLocaleString` does when it creates the string, but `new Date(...)` is going to use the *local* time zone's offset and DST rules when parsing that string. That is why you shouldn't use that approach. – Matt Johnson-Pint Mar 16 '21 at 15:49
  • this is my real goal question, maybe you can help, thanks, https://stackoverflow.com/questions/66664483/javascript-send-schedule-date-from-local-timezone-to-server-time – MarkAllen4512 Mar 16 '21 at 22:46
0
function convertTZ() {
    return new Date().toLocaleString('en-US', { timeZone: "America/Los_Angeles" });
}
console.log(convertTZ());

//Second way
//Hoepfully that's going to be the code that you need.You can change the way that you want to see the date.
function convertTZ() {
    return new Date().toLocaleString('en-US', {
    timeZone: "America/Los_Angeles" ,
  day: "numeric",
  month: "short",
  year: "numeric",
  hour: "numeric",
  minute: "2-digit"
});
}
console.log(convertTZ(),' America/Los Angeles');
Hani
  • 154
  • 6
0

As per your requirement, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/resolvedOptions will help to achieve it.

Dhara
  • 1,914
  • 2
  • 18
  • 37