This question already has answers here:
Convert a Unix timestamp to time in JavaScript
(34 answers)
Closed 4 years ago.
I have this code:
v.d = new Date().toLocaleTimeString();
it yields something like this:
20:11:40
So this is the time of day to the second, without milliseconds.
My question is: is there a built in call that can show just the time with milliseconds?
I am looking for something like this (to the millisecond):
20:11:40.124
This works, but I am looking for something more compact if possible:
const d = new Date();
v.d = d.toLocaleTimeString() + `.${d.getMilliseconds()}`;
this yields:
20:17:30.744
note that to make this work well, you need to add this part:
Formatting milliseconds to always 3 digits for d.getMilliseconds() call
There’s to ISOString(). But stepping back a level, with that exception there’s no standard for formatting dates in js. So you can use toISOString or build up your own string with individual date functions.
I did find one issue with your original solution. When I perform it it yields hh:mm:ss PM.mil. I assume you want hh:mm:ss.mil Here is that solution written as a function so you can pass the date object in and get the proper format:
const d = new Date()
const getTimeWithMilliseconds = date => {
const t = d.toLocaleTimeString();
return `${t.substring(0,8)}.${date.getMilliseconds() + t.substring(8,11)}`;
}
console.log(getTimeWithMilliseconds(d));
Or if you want it in 24 hour format:
const d = new Date()
const getTimeWithMilliseconds = date => {
return `${date.toLocaleTimeString('it-US')}.${date.getMilliseconds()}`;
}
console.log(getTimeWithMilliseconds(d));
You can't depend on toLocaleTimeString returning a specific format as it's implementation dependent. It's much more reliable to build the format yourself, e.g.:
function getFormattedTime(date) {
var d = date || new Date();
var z = n => ('0'+n).slice(-2);
var zz = n => ('00'+n).slice(-3);
return `${z(d.getHours())}:${z(d.getMinutes())}:${z(d.getSeconds())}.${zz(d.getMilliseconds())}`;
}
console.log(getFormattedTime());
console.log(getFormattedTime(new Date(2018,1,1)));
console.log(getFormattedTime(new Date(2018,4,30,23,51,12,89)));
Also see Where can I find documentation on formatting a date in JavaScript?
Related
This question already has answers here:
Convert date to another timezone in JavaScript
(34 answers)
Closed 1 year ago.
I have a little javascript file which I need to get the time of different timezone. I am only able to get the date but not the time.
let today = new Date();
let time = today.getTime();
let us = new Intl.DateTimeFormat('en-US').format(time);
let sv = new Intl.DateTimeFormat('sv').format(time);
console.log(us)
console.log(sv)
result in the console
2/25/2021
2021-02-25
i was able to solve the problem by using a javascript method called split whic was able to get me only the time part of the result.
const str3 = new Date().toLocaleString('en-US', { timeZone: 'Asia/Jakarta' });
ch_time = str3.split(" ")[1];
console.log(ch_time)
You can specify the date and time format using the "timeStyle" and "dateStyle" options. These can be full, long, medium, and short.
let us = Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'long' }).format(time));
The above code will produce:
"Weekday, day Month Year at hh:mm:ss GMT+X"
I have to parse a date and time string of format "2015-01-16 22:15:00". I want to parse this into JavaScript Date Object. Any help on this?
I tried some jquery plugins, moment.js, date.js, xdate.js. Still no luck.
With moment.js you can create a moment object using the String+Format constructor:
var momentDate = moment('2015-01-16 22:15:00', 'YYYY-MM-DD HH:mm:ss');
Then, you can convert it to JavaScript Date Object using toDate() method:
var jsDate = momentDate.toDate();
A better solution, I am now using date.js - https://code.google.com/p/datejs/
I included the script in my html page as this -
<script type="text/javascript" src="path/to/date.js"></script>
Then I simply parsed the date string "2015-01-16 22:15:00" with specifying the format as,
var dateString = "2015-01-16 22:15:00";
var date = Date.parse(dateString, "yyyy-MM-dd HH:mm:ss");
new Date("2015-01-16T22:15:00")
See Date.parse().
The string must be in the ISO-8601 format. If you want to parse other formats use moment.js.
moment("2015-01-16 22:15:00").toDate();
I was trying to use moment.js guys. But since I was having this error, "ReferenceError: moment is not defined", I had to skip it for now. I am using an temporary workaround for now.
function parseDate(dateString) {
var dateTime = dateString.split(" ");
var dateOnly = dateTime[0];
var timeOnly = dateTime[1];
var temp = dateOnly + "T" + timeOnly;
return new Date(temp);
}
Bit annoying, but not hard to write a parsing method yourself without any dependencies. Regular expressions are great to check the input against one or many date formats. Though, the Date in the format provided 'just works' by now. I.e. new Date('2015-01-16 22:15:00') works for me in firefox. I did this for a date that looked like '08.10.2020 10:40:32', which does not work and maybe the date provided does not work in some browsers. But this way you can parse it without relying on built in parsing methods.
function getAsDate(input) {
if (!input) return null;
if (input instanceof Date) return input;
// match '2015-01-16 22:15:00'
const regexDateMatch = '^[0-9]{4}\-[0-9]{1,2}\-[0-9]{1,2}\ [0-9]{2}\:[0-9]{2}\:[0-9]{2}$';
if(input.match(regexDateMatch)) {
const [year, month, day, hours, minutes, seconds] = input.split(/[-: ]/).map(x => parseInt(x));
const date = new Date(year, month, day, hours, minutes, seconds);
return date;
}
// Date formats supported by JS
return new Date(input);
}
Using Regex capture groups as suggested would also be an option.
function getAsDate(input) {
if (!input) return null;
if (input instanceof Date) return input;
// match '2015-01-16 22:15:00'
const regexDateMatch = '^([0-9]{4})\-([0-9]{1,2})\-([0-9]{1,2})\ ([0-9]{2})\:([0-9]{2})\:([0-9]{2})$';
let match;
if((match = input.match(regexDateMatch))) {
const [year, month, day, hours, minutes, seconds] = match.slice(1, 7).map(x => parseInt(x));
const date = new Date(year, month, day, hours, minutes, seconds);
return date;
}
// Date formats supported by JS
return new Date(input);
}
Hopefully JS upcomming temporal API will have a proper widely supported way to parse dates with a custom template. Then eventually we won´t have to deal with this anymore and all the other oddities of JS Date.
If you are sure it's in the desired format and don't need to error check, you can parse it manually using split (and optionally replace). I needed to do something similar in my project (MM/DD/YYYY HH:mm:ss:sss) and modified my solution to fit your format.
Notice the subtraction of 1 in the month.
var str = "2015-01-16 22:15:00";
//Replace dashes and spaces with : and then split on :
var strDate = str.replace(/-/g,":").replace(/ /g,":").split(":");
var aDate = new Date(strDate[0], strDate[1]-1, strDate[2], strDate[3], strDate[4], strDate[5]) ;
I have to say, I am not an expert with Javascript dates.. at all! I have looked at DateJS for instance, however my problem is not just a simple date conversion (or maybe it should be!).
Quick background:
I have a service call which returns some JSON data that include the dreaded Epoch style date from WCF/REST (I can't use Webapi at the moment - which would give me native JSON.NET?).
So a date examlple from the JSON object is:
StartDate: "/Date(1343378404560+0100)/"
Now, the JSON returned from my call has more information that I need for my Wijmo event calendar object, so I thought ok, will create a Javascript function/model for my Wijmo event object, and use jQuery MAP function to select only the fields I need.
My Javascript event model looks like this:
function wijmoEventModel(in_id, in_calendar, in_subject, in_location, in_start, in_end, in_description, in_colour, in_allday, in_tag) {
this._id = in_id;
this._calendar = in_calendar;
this._subject = in_subject;
this._location = in_location;
this._start = jsonDate(in_start);
this._end = jsonDate(in_end);
this._description = in_description;
this._colour = in_colour;
this._allday = in_allday;
this._tag = in_tag;
// Public Properties/Methods
return {
id: this.id,
calendar: this._calendar,
subject: this._subject,
location: this._location,
start: this._start,
end: this._end,
description: this._description,
color: this._colour,
allday: this._allday,
tag: this._tag
}
};
So, I have another little function that uses the jQuery MAP function as so:
function returnWijmoCalendarObject(diaryEventData) {
// Using jQuery map, reduce our raw event data down to only the required wijmo calendar items
var _calobj = $.map(diaryEventData, function (fld) {
return new wijmoEventModel(fld.ID, fld.ResourceCalendarID, fld.EventTitle, fld.Location, fld.StartDate, fld.EndDate, fld.Description, fld.ResourceColour, fld.AllDay);
});
return {
calendardata: _calobj
}
};
SO the above function just selects the required fields from my original full JSON return, and uses my Javascript function/model to return a new "calendardata" JSON object which I can use with my Wijmo event calendar..
There is one more small function which converts the Epoch style date "/Date(1343378404560+0100)/"
into (I think!) a real Javascript Date object.. like this:
function jsonDate(rawDate) {
var d = new Date();
d.setMilliseconds = parseInt(rawDate.substr(6));
return d;
}
So the above little function of course is used in the first code block above to hopefully convert that Epoch style original date into a Javascript Date.
SO MY QUESTION/PROBLEM IS:
The model above, and jQuery map function works well, I get a subset JSON object of exactly the structure I need, however the dates returned (wijmoEventModel.start & end) don't come back as a Javascript Date object?? even though debuging in that wijmoEventModel definitely has the dates as JS date objects??
Obviously I am missing/not understanding some vital and fundamental aspects here!!!
PLEASE! if anyone can help as this is driving me crazy...
David.
In the jsonDate function, the setMilliseconds property of d (not d itself) will be a date, which you could call from wijmoEventModel.start.d. You actually want var d = new Date(parseInt(rawDate.substr(6))). (Or do you want var d = new Date(parseInt(rawDate.split('+')[0]))?)
Setting milliseconds only sets the milliseconds part of a date, it doesn't set the date from an epoch.
At the heart of a javascript date object is a number of milliseconds since 1970-01-01 00:00:00 in UTC. So if the "time since epoch" that you have is the same, if you convert it to a number you can do:
var d = new Date( Number(millisecondsSinceEpoch) );
See ECMA-262 15.9.3.2
This will create a date object in the local timezone based on the "time since epoch" in UTC. So in different time zones it will show a different time that represent the same instant in UTC.
e.g.
var millisecondsSinceEpoch = '1343378404560';
alert( new Date(Number(millisecondsSinceEpoch))); //Fri Jul 27 2012 18:40:04 GMT+1000 (EST)
The time in the OP is '1343378404560+0100' which implies an offset that I'll assume is hhmm. So that needs to be subtracted from the number before passing it to Date:
var s = '1343378404560+0100';
var t = s.split('+')[1];
if (t) {
t = t.substring(0,2)*3600 + t.substring(2)*60;
} else {
t = 0;
}
var d = new Date(parseInt(s) - t * 1000); // Fri Jul 27 2012 17:40:04 GMT+1000 (EST)
Edit
The above assumes a sign of "+", the string should be split on either "+" or "-", then the sign detected and applied later, e.g.
var t = s.split(/[-+]/)[1];
After setting the value of t, apply the sign:
t *= /-/.test(s)? -1000 : 1000;
var d = new Date(parseInt(s) - t);
Or some variation of the above.
This question already has answers here:
Parsing a string to a date in JavaScript
(35 answers)
Closed 5 years ago.
Having this string 30/11/2011. I want to convert it to date object.
Do I need to use :
Date d = new Date(2011,11,30); /* months 1..12? */
or
Date d = new Date(2011,10,30); /* months 0..11? */
?
var d = new Date(2011,10,30);
as months are indexed from 0 in js.
You definitely want to use the second expression since months in JS are enumerated from 0.
Also you may use Date.parse method, but it uses different date format:
var timestamp = Date.parse("11/30/2011");
var dateObject = new Date(timestamp);
The syntax is as follows:
new Date(year, month [, day, hour, minute, second, millisecond ])
so
Date d = new Date(2011,10,30);
is correct; day, hour, minute, second, millisecond are optional.
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Date
There are multiple methods of creating date as discussed above. I would not repeat same stuff. Here is small method to convert String to Date in Java Script if that is what you are looking for,
function compareDate(str1){
// str1 format should be dd/mm/yyyy. Separator can be anything e.g. / or -. It wont effect
var dt1 = parseInt(str1.substring(0,2));
var mon1 = parseInt(str1.substring(3,5));
var yr1 = parseInt(str1.substring(6,10));
var date1 = new Date(yr1, mon1-1, dt1);
return date1;
}
Very simple:
var dt=new Date("2011/11/30");
Date should be in ISO format yyyy/MM/dd.
First extract the string like this
var dateString = str.match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
Then,
var d = new Date( dateString[3], dateString[2]-1, dateString[1] );
Always, for any issue regarding the JavaScript spec in practical, I will highly recommend the Mozilla Developer Network, and their JavaScript reference.
As it states in the topic of the Date object about the argument variant you use:
new Date(year, month, day [, hour, minute, second, millisecond ])
And about the months parameter:
month Integer value representing the month, beginning with 0 for January to 11 for December.
Clearly, then, you should use the month number 10 for November.
P.S.: The reason why I recommend the MDN is the correctness, good explanation of things, examples, and browser compatibility chart.
I can't believe javascript isn't more consistent with parsing dates. And I hear the default when there is no timezone is gonna change from UTC to local -- hope the web is prepared ;)
I prefer to let Javascript do the heavy lifting when it comes to parsing dates. However it would be nice to handle the local timezone issue fairly transparently. With both of these things in mind, here is a function to do it with the current status quo -- and when Javascript changes it will still work but then can be removed (with a little time for people to catch up with older browsers/nodejs of course).
function strToDate(dateStr)
{
var dateTry = new Date(dateStr);
if (!dateTry.getTime())
{
throw new Exception("Bad Date! dateStr: " + dateStr);
}
var tz = dateStr.trim().match(/(Z)|([+-](\d{2})\:?(\d{2}))$/);
if (!tz)
{
var newTzOffset = dateTry.getTimezoneOffset() / 60;
var newSignStr = (newTzOffset >= 0) ? '-' : '+';
var newTz = newSignStr + ('0' + Math.abs(newTzOffset)).slice(-2) + ':00';
dateStr = dateStr.trim() + newTz;
dateTry = new Date(dateStr);
if (!dateTry.getTime())
{
throw new Exception("Bad Date! dateStr: " + dateStr);
}
}
return dateTry;
}
We need a date object regardless; so createone. If there is a timezone, we are done. Otherwise, create a local timezone string using the +hh:mm format (more accepted than +hhmm).
My date objects in JavaScript are always represented by UTC +2 because of where I am located. Hence like this
Mon Sep 28 10:00:00 UTC+0200 2009
Problem is doing a JSON.stringify converts the above date to
2009-09-28T08:00:00Z (notice 2 hours missing i.e. 8 instead of 10)
What I need is for the date and time to be honoured but it's not, hence it should be
2009-09-28T10:00:00Z (this is how it should be)
Basically I use this:
var jsonData = JSON.stringify(jsonObject);
I tried passing a replacer parameter (second parameter on stringify) but the problem is that the value has already been processed.
I also tried using toString() and toUTCString() on the date object, but these don't give me what I want either..
Can anyone help me?
Recently I have run into the same issue. And it was resolved using the following code:
x = new Date();
let hoursDiff = x.getHours() - x.getTimezoneOffset() / 60;
let minutesDiff = (x.getHours() - x.getTimezoneOffset()) % 60;
x.setHours(hoursDiff);
x.setMinutes(minutesDiff);
JSON uses the Date.prototype.toISOString function which does not represent local time -- it represents time in unmodified UTC -- if you look at your date output you can see you're at UTC+2 hours, which is why the JSON string changes by two hours, but if this allows the same time to be represented correctly across multiple time zones.
date.toJSON() prints the UTC-Date into a String formatted (So adds the offset with it when converts it to JSON format).
date = new Date();
new Date(date.getTime() - (date.getTimezoneOffset() * 60000)).toJSON();
Just for the record, remember that the last "Z" in "2009-09-28T08:00:00Z" means that the time is indeed in UTC.
See http://en.wikipedia.org/wiki/ISO_8601 for details.
Out-of-the-box solution to force JSON.stringify ignore timezones:
Pure javascript (based on Anatoliy answer):
// Before: JSON.stringify apply timezone offset
const date = new Date();
let string = JSON.stringify(date);
console.log(string);
// After: JSON.stringify keeps date as-is!
Date.prototype.toJSON = function(){
const hoursDiff = this.getHours() - this.getTimezoneOffset() / 60;
this.setHours(hoursDiff);
return this.toISOString();
};
string = JSON.stringify(date);
console.log(string);
Using moment + moment-timezone libraries:
const date = new Date();
let string = JSON.stringify(date);
console.log(string);
Date.prototype.toJSON = function(){
return moment(this).format("YYYY-MM-DDTHH:mm:ss:ms");;
};
string = JSON.stringify(date);
console.log(string);
<html>
<header>
<script src="https://momentjs.com/downloads/moment.min.js"></script>
<script src="https://momentjs.com/downloads/moment-timezone-with-data-10-year-range.min.js"></script>
</header>
</html>
Here is another answer (and personally I think it's more appropriate)
var currentDate = new Date();
currentDate = JSON.stringify(currentDate);
// Now currentDate is in a different format... oh gosh what do we do...
currentDate = new Date(JSON.parse(currentDate));
// Now currentDate is back to its original form :)
you can use moment.js to format with local time:
Date.prototype.toISOString = function () {
return moment(this).format("YYYY-MM-DDTHH:mm:ss");
};
I'm a little late but you can always overwrite the toJson function in case of a Date using Prototype like so:
Date.prototype.toJSON = function(){
return Util.getDateTimeString(this);
};
In my case, Util.getDateTimeString(this) return a string like this: "2017-01-19T00:00:00Z"
I run into this a bit working with legacy stuff where they only work on east coast US and don't store dates in UTC, it's all EST. I have to filter on the dates based on user input in the browser so must pass the date in local time in JSON format.
Just to elaborate on this solution already posted - this is what I use:
// Could be picked by user in date picker - local JS date
date = new Date();
// Create new Date from milliseconds of user input date (date.getTime() returns milliseconds)
// Subtract milliseconds that will be offset by toJSON before calling it
new Date(date.getTime() - (date.getTimezoneOffset() * 60000)).toJSON();
So my understanding is this will go ahead and subtract time (in milliseconds (hence 60000) from the starting date based on the timezone offset (returns minutes) - in anticipation for the addition of time toJSON() is going to add.
JavaScript normally convert local timezone to UTC .
date = new Date();
date.setMinutes(date.getMinutes()-date.getTimezoneOffset())
JSON.stringify(date)
Usually you want dates to be presented to each user in his own local time-
that is why we use GMT (UTC).
Use Date.parse(jsondatestring) to get the local time string,
unless you want your local time shown to each visitor.
In that case, use Anatoly's method.
Got around this issue by using the moment.js library (the non-timezone version).
var newMinDate = moment(datePicker.selectedDates[0]);
var newMaxDate = moment(datePicker.selectedDates[1]);
// Define the data to ask the server for
var dataToGet = {"ArduinoDeviceIdentifier":"Temperatures",
"StartDate":newMinDate.format('YYYY-MM-DD HH:mm'),
"EndDate":newMaxDate.format('YYYY-MM-DD HH:mm')
};
alert(JSON.stringify(dataToGet));
I was using the flatpickr.min.js library. The time of the resulting JSON object created matches the local time provided but the date picker.
Here is something really neat and simple (atleast I believe so :)) and requires no manipulation of date to be cloned or overloading any of browser's native functions like toJSON (reference: How to JSON stringify a javascript Date and preserve timezone, courtsy Shawson)
Pass a replacer function to JSON.stringify that stringifies stuff to your heart's content!!! This way you don't have to do hour and minute diffs or any other manipulations.
I have put in console.logs to see intermediate results so it is clear what is going on and how recursion is working. That reveals something worthy of notice: value param to replacer is already converted to ISO date format :). Use this[key] to work with original data.
var replacer = function(key, value)
{
var returnVal = value;
if(this[key] instanceof Date)
{
console.log("replacer called with key - ", key, " value - ", value, this[key]);
returnVal = this[key].toString();
/* Above line does not strictly speaking clone the date as in the cloned object
* it is a string in same format as the original but not a Date object. I tried
* multiple things but was unable to cause a Date object being created in the
* clone.
* Please Heeeeelp someone here!
returnVal = new Date(JSON.parse(JSON.stringify(this[key]))); //OR
returnVal = new Date(this[key]); //OR
returnVal = this[key]; //careful, returning original obj so may have potential side effect
*/
}
console.log("returning value: ", returnVal);
/* if undefined is returned, the key is not at all added to the new object(i.e. clone),
* so return null. null !== undefined but both are falsy and can be used as such*/
return this[key] === undefined ? null : returnVal;
};
ab = {prop1: "p1", prop2: [1, "str2", {p1: "p1inner", p2: undefined, p3: null, p4date: new Date()}]};
var abstr = JSON.stringify(ab, replacer);
var abcloned = JSON.parse(abstr);
console.log("ab is: ", ab);
console.log("abcloned is: ", abcloned);
/* abcloned is:
* {
"prop1": "p1",
"prop2": [
1,
"str2",
{
"p1": "p1inner",
"p2": null,
"p3": null,
"p4date": "Tue Jun 11 2019 18:47:50 GMT+0530 (India Standard Time)"
}
]
}
Note p4date is string not Date object but format and timezone are completely preserved.
*/
I ran into the same problem.
The way I resolvet it was:
var currentTime = new Date();
Console.log(currentTime); //Return: Wed Sep 15 13:52:09 GMT-05:00 2021
Console.log(JSON.stringify(currentTime)); //Return: "2021-09-15T18:52:09.891Z"
var currentTimeFixed = new Date(currentTime.setHours(currentTime.getHours() - (currentTime.getUTCHours() - currentTime.getHours())));
Console.log(JSON.stringify(currentTimeFixed)); //Return: "2021-09-15T13:52:09.891Z"
I wrote the following code blog where it makes service calls.. it will try to serializable the json in every post submission, it will format to local date it again.
protected async post(endPoint: string, data, panelName?: string, hasSuccessMessage: boolean = false): Promise<Observable<any>> {
const options = this.InitHeader(true);
const url: string = this._baseUrl + endPoint;
Date.prototype.toJSON = function () {
return moment(this).format("YYYY-MM-DDThh:mm:00.000Z");;
};
return await this._http.post(url, data, options).pipe(map(response => {
return this.Map<any>(response, null);
}));
}
All boils down to if your server backend is timezone-agnostic or not.
If it is not, then you need to assume that timezone of server is the same as client, or transfer information about client's timezone and include that also into calculations.
a PostgreSQL backend based example:
select '2009-09-28T08:00:00Z'::timestamp -> '2009-09-28 08:00:00' (wrong for 10am)
select '2009-09-28T08:00:00Z'::timestamptz -> '2009-09-28 10:00:00+02'
select '2009-09-28T08:00:00Z'::timestamptz::timestamp -> '2009-09-28 10:00:00'
The last one is probably what you want to use in database, if you are not willing properly implement timezone logic.
Instead of toJSON, you can use format function which always gives the correct date and time + GMT
This is the most robust display option. It takes a string of tokens
and replaces them with their corresponding values.
I tried this in angular 8 :
create Model :
export class Model { YourDate: string | Date; }
in your component
model : Model;
model.YourDate = new Date();
send Date to your API for saving
When loading your data from API you will make this :
model.YourDate = new Date(model.YourDate+"Z");
you will get your date correctly with your time zone.
In this case I think you need transform the date to UNIX timestamp
timestamp = testDate.getTime();
strJson = JSON.stringify(timestamp);
After that you can re use it to create a date object and format it. Example with javascript and toLocaleDateString ( https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Date/toLocaleDateString )
newDateObject = new Date(JSON.parse(strJson));
newDateObject = newDateObject.toLocalDateStrin([
"fr-FR",
]);
If you use stringify to use AJAX, now it's not useful. You just need to send timestamp and get it in your script:
$newDateObject = new \DateTime();
$newDateObject->setTimestamp(round($timestamp/1000));
Be aware that getTime() will return a time in milliseconds and the PHP function setTimestamp take time in seconds. It's why you need to divide by 1000 and round.
In Angular place the following in index.js script section:
setTimeout(function (){
Date.prototype.toJSON = function(){
return new Date(this).toLocaleDateString("en-US") + " "+new Date(this).toLocaleTimeString();
}},1000);