3

I am attempting to show the time using milliseconds. I'm using the toLocaleTimeString since it supports the locale. 

var milliseconds = 10000;
var date = new Date(milliseconds); 

console.log(date.toLocaleTimeString('en',milliseconds));

// expected result - 0:0:10 AM
// actual result   - 5:30:10 AM

The result is not what I'm expected. How can get the expected result using toLocaleTimeString

cнŝdk
  • 31,391
  • 7
  • 56
  • 78
Sachila Ranawaka
  • 39,756
  • 7
  • 56
  • 80
  • 1
    You should read the MDN article on [*toLocaleTimeString*](https://stackoverflow.com/questions/46765146/show-time-from-milliseconds-by-using-tolocaletimestring). The second argument should be an options object, not a number. – RobG Oct 16 '17 at 10:03

2 Answers2

0

The normal behaviour of the .toLocaleTimeString() method is to display the time in a string representation based on the local time zone of your environment, that's why you got a different result.

And you were passing a wrong argument milliseconds to it in:

date.toLocaleTimeString('en',milliseconds);

Actually the Date.prototype.toLocaleTimeString() method takes an options object as a second argument, where you can specify several options including the timeZone which specifies the desired time zone for the output.

So call it with {"timeZone": "UTC"} to display it in UTC, like this:

date.toLocaleTimeString('en',{"timeZone": "UTC"})

Demo:

var milliseconds = 10000;
var date = new Date(milliseconds); 

console.log(date.toLocaleTimeString('en',{"timeZone": "UTC"}));

// expected result - 0:0:10 AM
// actual result   - 5:30:10 AM
cнŝdk
  • 31,391
  • 7
  • 56
  • 78
  • 1
    Where do we find the prototype definition for the options object? I see people giving examples of the properties on that object, but I cant find what those properties are, or what the compatible values could be. – PaulG Aug 06 '21 at 12:12
  • @PaulG I juste reffered to the [**MDN docs**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString#using_options), you can find there some examples using `options` . – cнŝdk Aug 06 '21 at 12:28
  • Thanks fror the response :) I see the examples there, but I thought there should be some docs somwehere that describe the object completely, e.g. showing the other possible values for each property. Having said that, I did notice that we can get some insight into that via intellisense (VsCode or webstorm at least), so that gets me to where I need to go. I also noticed via intellisense the type of the options object (Intl.DateTimeFormatOptions). Also - it turns out that these types were added relatively recently in this PR on 13 May 2020: https://github.com/microsoft/TypeScript/pull/38522 – PaulG Aug 06 '21 at 14:28
  • 1
    Ah Okey, great but I no the MDN docs doesn't have such section. – cнŝdk Aug 06 '21 at 18:09
-1

In var date = new Date(10000);, the "10000" unit is always relative to 1970-01-01 00:00:00 in UTC timezone (i.e. add 10000ms from it). Thus, the corresponding time is equivalent to 1970-01-01 00:00:10 UTC.

date.toLocaleTimeString('en') output the time in your system timezone, thus gives the difference you found.

One way to fix is to set date variable to system timezone by adding the timezone difference in milliseconds, as the following:

var date = new Date(10000 + new Date().getTimezoneOffset()*60000); (new Date().getTimezoneOffset() is timezone difference in minutes)

Johnny Wong
  • 945
  • 9
  • 16