Categories
date date-format datetime-format javascript time-format

Where can I find documentation on formatting a date in JavaScript?

1484

I noticed that JavaScript’s new Date() function is very smart in accepting dates in several formats.

Xmas95 = new Date("25 Dec, 1995 23:15:00")
Xmas95 = new Date("2009 06 12,12:52:39")
Xmas95 = new Date("20 09 2006,12:52:39")

I could not find documentation anywhere showing all the valid string formats while calling new Date() function.

This is for converting a string to a date. If we look at the opposite side, that is, converting a date object to a string, until now I was under the impression that JavaScript doesn’t have a built-in API to format a date object into a string.

Editor’s note: The following approach is the asker’s attempt that worked on a particular browser but does not work in general; see the answers on this page to see some actual solutions.

Today, I played with the toString() method on the date object and surprisingly it serves the purpose of formatting date to strings.

var d1 = new Date();
d1.toString('yyyy-MM-dd');       //Returns "2009-06-29" in Internet Explorer, but not Firefox or Chrome
d1.toString('dddd, MMMM ,yyyy')  //Returns "Monday, June 29,2009" in Internet Explorer, but not Firefox or Chrome

Also here I couldn’t find any documentation on all the ways we can format the date object into a string.

Where is the documentation which lists the format specifiers supported by the Date() object?

12

  • 170

    your examples don’t actually work the way you think they do: jsfiddle.net/edelman/WDNVk/1

    – Jason

    Dec 3, 2010 at 17:46

  • 30

    Sorry, passing format strings in toString works in .NET, and it may work in Java, but as Jason pointed out, this doesn’t actually work in Javascript.

    Mar 8, 2011 at 20:17

  • 16

    Folks remember – questions, no matter how canonical, need to remain questions. Please refrain from any edit that turns this question into an answer, refine and maintain the answers instead. Thanks 🙂

    – Tim Post

    Nov 7, 2013 at 10:11

  • 2

    I used the code in this link msdn.microsoft.com/en-us/library/ie/ff743760(v=vs.94).aspx — (date.toLocaleDateString(“en-US”));

    May 25, 2014 at 16:52

  • If future visitors to this page are confused by how most of the answers relate to the question, I suggest reading the question revisions, especially (if different from above) revision 15 @Eric Muyser – I for one was confused by the lack of the invalid Date#toString usage.

    – user66001

    Jan 14, 2015 at 19:25


1115

I love 10 ways to format time and date using JavaScript and Working with Dates.

Basically, you have three methods and you have to combine the strings for yourself:

getDate() // Returns the date
getMonth() // Returns the month
getFullYear() // Returns the year

Example:

var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1; //Months are zero based
var curr_year = d.getFullYear();
console.log(curr_date + "-" + curr_month + "-" + curr_year);

15

  • 32

    Both of these sites have restrictive licenses. So if you use the code (without permission), you’ll be in violation. Momentjs (stackoverflow.com/a/10119138/278976) looks like a way better option and is MIT license.

    – Homer6

    May 24, 2012 at 0:00


  • 4

    @peller This answer answers the question “How do I format dates in javascript?” which is effectively the title of the question. In the body of the question he is quite mislead. And, to your point, this answer does not talk about string formatting using random non-standard or not mentioned libraries. But that part of the question was asked incorrectly, as the #1 comment on the question points out. So, this answers the real question, but not the format strings that don’t actually exist.

    – McKay

    Jun 7, 2012 at 14:01

  • 3

    @McKay; that wasn’t the question. I think you’re either misunderstanding what the peller is asking or being obtuse in your reasoning.

    Jul 16, 2012 at 16:34

  • 10

    @codeinthehole “Formatting dates in Javascript” is the question. “until now I was under the impression that JavaScript doesn’t have a built-in API to format a date object into a string.” but then talks about the behavior, that I believe he thinks is native in javascript. Without knowing which library he mistakenly references, I think the best guess is that he’s asking the question, “How do I format dates in javascript?” and I don’t think I’m taking wild leaps.

    – McKay

    Jul 16, 2012 at 19:24

  • 5

    MM mean 01-12, not 1-12: 2013-04-17 => OK 2013-4-17 => BAD

    Apr 17, 2013 at 9:10

687

Moment.js

It is a (lightweight)* JavaScript date library for parsing, manipulating, and formatting dates.

var a = moment([2010, 1, 14, 15, 25, 50, 125]);
a.format("dddd, MMMM Do YYYY, h:mm:ss a"); // "Sunday, February 14th 2010, 3:25:50 pm"
a.format("ddd, hA");                       // "Sun, 3PM"

(*) lightweight meaning 9.3KB minified + gzipped in the smallest possible setup (feb 2014)

14

  • 7

    This also provides a decorator pattern around the Date object instead of monkey punching the core object, so you’re less likely to get conflicts down the road.

    Nov 26, 2012 at 18:20

  • 128

    Please stop abusing the word “lightweight”. Even 5kb is ridiculously large for such functionality, and as per today that size has increased to 19kb.

    Sep 26, 2013 at 6:22

  • 27

    @Pumbaa80 I disagree that “Even 5kb is ridiculously large for such functionality”. Have you seen the docs? It is an extremely useful library for dealing with dates in JS. I understand having a library greater than a couple of KBs for a single use of a basic format like “D/M/Y” can be a little overkill however differences of a few KBs is becoming negligible for then the ease of use the library provides. Maintainable code is a good thing for the sake of a few KBs. If it was +100KB minified, I would however agree.

    – Turnerj

    Dec 4, 2013 at 1:26

  • 17

    @Tumerj arguing that it is useful does nothing to address the concern of being lightweight. The two are not related.

    May 30, 2014 at 19:58

  • 9

    You can’t make a jet plane more lightweight by removing the engine because it then becomes a glider and not a jet. Lightweight means something has only necessary functionality to perform a specified function. Ergo, this is a lightweight solution.

    – Bon

    Jun 25, 2014 at 0:47

430

If you are already using jQuery UI in your project, you can use the built-in datepicker method for formatting your date object:

$.datepicker.formatDate('yy-mm-dd', new Date(2007, 1 - 1, 26));

However, the datepicker only formats dates, and cannot format times.

Have a look at jQuery UI datepicker formatDate, the examples.

7

  • how to tell it to use local time or Zulu?

    Mar 2, 2012 at 16:14

  • 7

    i prefer use this solution able to get the time without any library : new Date().toTimeString().match( /^([0-9]{2}:[0-9]{2}:[0-9]{2})/ )[0] FYI

    – markcial

    May 31, 2012 at 8:05


  • is there a way to do this. $.datepicker.formatDate(‘yy-mm-dd’, new Date(“txtAdvDate”.Val()); or some thing like that

    – Pomster

    Jun 1, 2012 at 13:09

  • @Pomster – what would make you think the string “txtAdvDate” would have a val method on it? Do you mean $(‘#txtAdvDate’).val()? Assuming it fits one of the constructors (see here w3schools.com/jsref/jsref_obj_date.asp) then that would work just fine.

    Sep 27, 2012 at 15:46

  • @Pomster – try using this: document.getElementById(id).value = $.datepicker.formatDate(‘yy-mm-dd’, new Date());

    – mrrsb

    Dec 10, 2012 at 9:16