Some browser gotchas when working with date object in JavaScript (IE, Firefox, Chrome)

While I was doing some timezone stuff (that will likely have its own post), I came across some gotachas browser around working with date and time in JavaScript (blame the browsers, not JS itself):

  1. There are very nice ISO standards to model date and time, their support is flaky, especially in, yes, IE. So, if you want to use them, you need a library that parses your standard and deal with it nicely (yes, there are some).
  2. If you try to format dates with dd/mm/yyy instead of mm/dd/yyyy (the American standard), browsers will will play messy, Some methods will simply invert the values (They will think the day 30 is June, maybe as 30-12-12=6, and some methods may fail to parse getting you NaNs and "Invalid Date"s getting values of fields and trying to convert to string). They’re not broken in consistent way I think.
    The important note is that setting language preferences in browsers to "not" include English (US) does not change this.
  3. The "toString()" implementation of date objects in browsers is not exactly the same. For example, IE might try saying "UTC+1100 2010" at the end for EAST with daylight saving on, while Chrome will say "AUS Eastern Daylight Time".
  4. You probably know some of these, on a date’ JavaScript object (like DateTime in .NET):
    1. The function ‘getDay()’ gets the day of the week (0 to 6) for the specific date according to local time.
    2. If you want the day of the month, you use "getDate()" on a date object, which gets you ONLY the day of the month (from 1 to 31).
    3. The "getMonth()" function gets you the month from 0 to 11 instead of 1 to 12, which is like "getDay(), )of week), and unlike "getDate" (day of month), "getYear()" (2 digits format), and "getFullYear()" which are not zero-based.


Next, I’ll show a sample code of how to send UTC dates to the browser, and get them displayed in the user’s local time, in the most efficient way we can get for big pages / huge DOM tree..


Stay tuned!

Share With Friends:

P.S. Please help me out by checking this offer, then look below for a small Thank You.

How did I learn that?

As a bonus for coming here, I'm giving away a free newsletter for web developers that you can sign up for from here.
It's not an anything-and-everything link list. It's thoughtfully collected picks of articles and tools, that focus on Angular 2, ASP.NET 5, and other fullstack developer goodies.