[javascript] How to format a JavaScript date

In JavaScript, how can I format a date object to print as 10-Aug-2010?

This question is related to javascript date date-formatting

The answer is


This is the main answer modified to have 3-char months, and 2-digit year:

_x000D_
_x000D_
function formatDate(date) {_x000D_
    var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];_x000D_
    var day = date.getDate(), monthIndex = date.getMonth(), year = date.getFullYear().toString().substr(-2);_x000D_
    return day + ' ' + monthNames[monthIndex] + ' ' + year;_x000D_
}_x000D_
_x000D_
document.write(formatDate(new Date()));
_x000D_
_x000D_
_x000D_


If you need to quickly format your date using plain JavaScript, use getDate, getMonth + 1, getFullYear, getHours and getMinutes:

var d = new Date();

var datestring = d.getDate()  + "-" + (d.getMonth()+1) + "-" + d.getFullYear() + " " +
d.getHours() + ":" + d.getMinutes();

// 16-5-2015 9:50

Or, if you need it to be padded with zeros:

var datestring = ("0" + d.getDate()).slice(-2) + "-" + ("0"+(d.getMonth()+1)).slice(-2) + "-" +
    d.getFullYear() + " " + ("0" + d.getHours()).slice(-2) + ":" + ("0" + d.getMinutes()).slice(-2);

// 16-05-2015 09:50

Here is some ready-to-paste time/date formatting code that does NOT rely on any external modules/libraries or use jQuery or ES7 or anything. Unlike the code in some other answers, this code offers this combo of features:

  • it takes a JavaScript Date object as input
  • it can display date as local time zone or UTC
  • it uses a simple formatting system "{year4} {month02} {second}" that is easy to read and understand even after you write the code, unlike the typical "%D %m %-" which always forces you back to the documentation
  • the formatting system does not have any weird self-collisions like some ad-hoc "DD MM YYYY" systems
  • you can run the test right here and try it

_x000D_
_x000D_
// format_date(date, pattern, utc)_x000D_
// - date _x000D_
//   - a JavaScript Date object_x000D_
//   - use "new Date()" for current time_x000D_
// - pattern_x000D_
//   - a string with embedded {codes} like_x000D_
//     "{year4}-{month02}-{day02}: {dayname3}"_x000D_
//     see format_date_funcs below for complete list_x000D_
//   - any other letters go through unchanged_x000D_
// - utc_x000D_
//   - if true, shows date in UTC time "zone"_x000D_
//   - if false/omitted, shows date in local time zone_x000D_
//_x000D_
var month_names = _x000D_
[_x000D_
  "January", "February", "March", "April", "May", "June", "July",_x000D_
  "August", "September", "October", "November", "December"_x000D_
];_x000D_
var day_of_week_names = _x000D_
[_x000D_
  "Sunday", "Monday", "Tuesday",_x000D_
  "Wednesday", "Thursday", "Friday", "Saturday"_x000D_
];_x000D_
function space_pad2(num)_x000D_
{_x000D_
    return num < 10 ? " " + num : num;_x000D_
}_x000D_
function zero_pad2(num)_x000D_
{_x000D_
    return num < 10 ? "0" + num : num;_x000D_
}_x000D_
function space_pad3(num)_x000D_
{_x000D_
    if (num < 10) _x000D_
        return "  " + num;_x000D_
    else if (num < 100)_x000D_
        return " " + num;_x000D_
    else_x000D_
        return num;_x000D_
}_x000D_
function zero_pad3(num)_x000D_
{_x000D_
    if (num < 10) _x000D_
        return "00" + num;_x000D_
    else if (num < 100)_x000D_
        return "0" + num;_x000D_
    else_x000D_
        return num;_x000D_
}_x000D_
var format_date_funcs =_x000D_
{_x000D_
    // {year4}  = '1902'_x000D_
    // {year02} =   '02'_x000D_
    // _x000D_
    'year4': function(date, utc)_x000D_
    {_x000D_
        var year = utc ? date.getUTCFullYear() : date.getFullYear();_x000D_
        return year;_x000D_
    },_x000D_
    'year02': function(date, utc)_x000D_
    {_x000D_
        var year = utc ? date.getUTCFullYear() : date.getFullYear();_x000D_
        return year.toString().substr(2,2);_x000D_
    },_x000D_
    // {month}   =  '1' - '12'_x000D_
    // {month2}  = ' 1' - '12' (space padded)_x000D_
    // {month02} = '01' - '12'_x000D_
    //_x000D_
    'month': function(date, utc)_x000D_
    {_x000D_
        var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]_x000D_
        return            month + 1;_x000D_
    },_x000D_
    'month2': function(date, utc)_x000D_
    {_x000D_
        var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]_x000D_
        return space_pad2(month + 1);_x000D_
    },_x000D_
    'month02': function(date, utc)_x000D_
    {_x000D_
        var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]_x000D_
        return zero_pad2(month + 1);_x000D_
    },_x000D_
    // {monthname}  = 'January'_x000D_
    // {monthname3} = 'Jan'_x000D_
    // _x000D_
    'monthname': function(date, utc)_x000D_
    {_x000D_
        var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]_x000D_
        return month_names[month];_x000D_
    },_x000D_
    'monthname3': function(date, utc)_x000D_
    {_x000D_
        var month = utc ? date.getUTCMonth() : date.getMonth(); // [0,11]_x000D_
        return month_names[month].substr(0, 3);_x000D_
    },_x000D_
    // {day}   =  '1' - '31'_x000D_
    // {day2}  = ' 1' - '31' (space padded)_x000D_
    // {day02} = '01' - '31'_x000D_
    // _x000D_
    'day': function(date, utc)_x000D_
    {_x000D_
        var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]_x000D_
        return date;_x000D_
    },_x000D_
    'day2': function(date, utc)_x000D_
    {_x000D_
        var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]_x000D_
        return space_pad2(date);_x000D_
    },_x000D_
    'day02': function(date, utc)_x000D_
    {_x000D_
        var date = utc ? date.getUTCDate() : date.getDate(); // [1,31]_x000D_
        return zero_pad2(date);_x000D_
    },_x000D_
    // {dayname}  = 'Tuesday'_x000D_
    // {dayname3} = 'Tue'_x000D_
    // _x000D_
    'dayname': function(date, utc)_x000D_
    {_x000D_
        var day = utc ? date.getUTCDay() : date.getDay(); // [0,6]_x000D_
        return day_of_week_names[day];_x000D_
    },_x000D_
    'dayname3': function(date, utc)_x000D_
    {_x000D_
        var day = utc ? date.getUTCDay() : date.getDay(); // [0,6]_x000D_
        return day_of_week_names[day].substr(0,3);_x000D_
    },_x000D_
    // {24hour}   =  '0' - '23'_x000D_
    // {24hour2}  = ' 0' - '23' (space padded)_x000D_
    // {24hour02} = '00' - '23'_x000D_
    //_x000D_
    '24hour': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        return hour;_x000D_
    },_x000D_
    '24hour2': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        return space_pad2(hour);_x000D_
    },_x000D_
    '24hour02': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        return zero_pad2(hour);_x000D_
    },_x000D_
    // {12hour}   =  '1' - '12'_x000D_
    // {12hour2}  = ' 1' - '12' (space padded)_x000D_
    // {12hour02} = '01' - '12'_x000D_
    // {ampm}     = 'am' or 'pm'_x000D_
    // {AMPM}     = 'AM' or 'PM'_x000D_
    //_x000D_
    '12hour': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        hour = hour % 12; // [0,11]_x000D_
        if (0 === hour) hour = 12;_x000D_
        return hour;_x000D_
    },_x000D_
    '12hour2': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        hour = hour % 12; // [0,11]_x000D_
        if (0 === hour) hour = 12;_x000D_
        return space_pad2(hour);_x000D_
    },_x000D_
    '12hour02': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        hour = hour % 12; // [0,11]_x000D_
        if (0 === hour) hour = 12;_x000D_
        return zero_pad2(hour);_x000D_
    },_x000D_
    'ampm': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        return (hour < 12 ? 'am' : 'pm');_x000D_
    },_x000D_
    'AMPM': function(date, utc)_x000D_
    {_x000D_
        var hour = utc ? date.getUTCHours() : date.getHours(); // [0,23]_x000D_
        return (hour < 12 ? 'AM' : 'PM');_x000D_
    },_x000D_
    // {minute}   =  '0' - '59'_x000D_
    // {minute2}  = ' 0' - '59' (space padded)_x000D_
    // {minute02} = '00' - '59'_x000D_
    // _x000D_
    'minute': function(date, utc)_x000D_
    {_x000D_
        var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]_x000D_
        return minute;_x000D_
    },_x000D_
    'minute2': function(date, utc)_x000D_
    {_x000D_
        var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]_x000D_
        return space_pad2(minute);_x000D_
    },_x000D_
    'minute02': function(date, utc)_x000D_
    {_x000D_
        var minute = utc ? date.getUTCMinutes() : date.getMinutes(); // [0,59]_x000D_
        return zero_pad2(minute);_x000D_
    },_x000D_
    // {second}   =  '0' - '59'_x000D_
    // {second2}  = ' 0' - '59' (space padded)_x000D_
    // {second02} = '00' - '59'_x000D_
    // _x000D_
    'second': function(date, utc)_x000D_
    {_x000D_
        var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]_x000D_
        return second;_x000D_
    },_x000D_
    'second2': function(date, utc)_x000D_
    {_x000D_
        var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]_x000D_
        return space_pad2(second);_x000D_
    },_x000D_
    'second02': function(date, utc)_x000D_
    {_x000D_
        var second = utc ? date.getUTCSeconds() : date.getSeconds(); // [0,59]_x000D_
        return zero_pad2(second);_x000D_
    },_x000D_
    // {msec}   =   '0' - '999'_x000D_
    // {msec3}  = '  0' - '999' (space padded)_x000D_
    // {msec03} = '000' - '999'_x000D_
    // _x000D_
    'msec': function(date, utc)_x000D_
    {_x000D_
        var msec = _x000D_
            utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]_x000D_
        return msec;_x000D_
    },_x000D_
    'msec3': function(date, utc)_x000D_
    {_x000D_
        var msec = _x000D_
            utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]_x000D_
        return space_pad3(msec);_x000D_
    },_x000D_
    'msec03': function(date, utc)_x000D_
    {_x000D_
        var msec = _x000D_
            utc ? date.getUTCMilliseconds() : date.getMilliseconds(); // [0,999]_x000D_
        return zero_pad3(msec);_x000D_
    },_x000D_
    // {open} = '{' (in case you actually want '{' in the output)_x000D_
    //_x000D_
    'open': function(date, utc)_x000D_
    {_x000D_
        return '{';_x000D_
    }, _x000D_
    // {close} = '}' (in case you actually want '}' in the output)_x000D_
    //_x000D_
    'close': function(date, utc)_x000D_
    {_x000D_
        return '}';_x000D_
    }, _x000D_
};_x000D_
function format_date(date, pattern, utc)_x000D_
{_x000D_
    if (!pattern) _x000D_
    {_x000D_
        pattern = '{month}/{day}/{year4}';_x000D_
    }_x000D_
_x000D_
    var ret = '';_x000D_
_x000D_
    while (pattern.length > 0)_x000D_
    {_x000D_
        var s = pattern.indexOf('{');_x000D_
        var e = pattern.indexOf('}');_x000D_
        //console.log('s ' + s + ' e ' + e);_x000D_
        if (-1 !== s && -1 !== e && s < e)_x000D_
        {_x000D_
            // - there is a well-formed {foo} in range [s,e]_x000D_
            // - first we emit range [0,s) as literal_x000D_
        }_x000D_
        else_x000D_
        {_x000D_
            // - rest of string has no {} or has malformed }{ or { or }_x000D_
            // - just emit the rest of the string as literal and be done_x000D_
            s = pattern.length; _x000D_
        }_x000D_
        // emit range [0,s) as literal_x000D_
        if (s > 0)_x000D_
        {_x000D_
            ret += pattern.substr(0, s);_x000D_
            pattern = pattern.substr(s);_x000D_
            e -= s;_x000D_
            s = 0;_x000D_
        }_x000D_
_x000D_
        if (0 === pattern.length) break;_x000D_
_x000D_
        // emit range [s=0,e] by evaluating code_x000D_
        console.assert(0 === s); // position of {_x000D_
        console.assert(e > 0);  // position of }_x000D_
        console.assert('{' === pattern.substr(s, 1));_x000D_
        console.assert('}' === pattern.substr(e, 1));_x000D_
        var code = pattern.substr(1,e-1);_x000D_
        var func = format_date_funcs[code];_x000D_
        console.assert(func);_x000D_
        ret += func(date, utc);_x000D_
_x000D_
        pattern = pattern.substr(e+1);_x000D_
    }_x000D_
_x000D_
    return ret;_x000D_
}_x000D_
_x000D_
if (1) // test format_date_x000D_
{_x000D_
    var fmt = '[';_x000D_
    for (var func in format_date_funcs) _x000D_
    {_x000D_
        if (!format_date_funcs.hasOwnProperty(func)) continue;_x000D_
        fmt += '{' + func + '}/';_x000D_
    }_x000D_
    fmt += ']';_x000D_
    var now = new Date();_x000D_
    console.log(fmt);_x000D_
    console.log(format_date(now, fmt, false /*utc*/));_x000D_
    console.log(format_date(now, fmt, true /*utc*/));_x000D_
}
_x000D_
_x000D_
_x000D_


If you are already using jQuery UI in your project you could do it this way:

var formatted = $.datepicker.formatDate("M d, yy", new Date("2014-07-08T09:02:21.377"));

// formatted will be 'Jul 8, 2014'

Some datepicker date format options to play with are available here.


Custom formatting function:

For fixed formats, a simple function make the job. The following example generates the international format YYYY-MM-DD:

_x000D_
_x000D_
function dateToYMD(date) {
    var d = date.getDate();
    var m = date.getMonth() + 1; //Month from 0 to 11
    var y = date.getFullYear();
    return '' + y + '-' + (m<=9 ? '0' + m : m) + '-' + (d <= 9 ? '0' + d : d);
}

console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
_x000D_
_x000D_
_x000D_

The OP format may be generated like:

_x000D_
_x000D_
function dateToYMD(date) {
    var strArray=['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
    var d = date.getDate();
    var m = strArray[date.getMonth()];
    var y = date.getFullYear();
    return '' + (d <= 9 ? '0' + d : d) + '-' + m + '-' + y;
}
console.log(dateToYMD(new Date(2017,10,5))); // Nov 5
_x000D_
_x000D_
_x000D_

Note: It is, however, usually not a good idea to extend the JavaScript standard libraries (e.g. by adding this function to the prototype of Date).

A more advanced function could generate configurable output based on a format parameter.

If to write a formatting function is too long, there are plenty of libraries around which does it. Some other answers already enumerate them. But increasing dependencies also has it counter-part.

Standard ECMAScript formatting functions:

Since more recent versions of ECMAScript, the Date class has some specific formatting functions:

toDateString: Implementation dependent, show only the date.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.todatestring

new Date().toDateString(); // e.g. "Fri Nov 11 2016"

toISOString: Show ISO 8601 date and time.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.toisostring

new Date().toISOString(); // e.g. "2016-11-21T08:00:00.000Z"

toJSON: Stringifier for JSON.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.tojson

new Date().toJSON(); // e.g. "2016-11-21T08:00:00.000Z"

toLocaleDateString: Implementation dependent, a date in locale format.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.tolocaledatestring

new Date().toLocaleDateString(); // e.g. "21/11/2016"

toLocaleString: Implementation dependent, a date&time in locale format.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.tolocalestring

new Date().toLocaleString(); // e.g. "21/11/2016, 08:00:00 AM"

toLocaleTimeString: Implementation dependent, a time in locale format.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.tolocaletimestring

new Date().toLocaleTimeString(); // e.g. "08:00:00 AM"

toString: Generic toString for Date.

http://www.ecma-international.org/ecma-262/index.html#sec-date.prototype.tostring

new Date().toString(); // e.g. "Fri Nov 21 2016 08:00:00 GMT+0100 (W. Europe Standard Time)"

Note: it is possible to generate custom output out of those formatting >

new Date().toISOString().slice(0,10); //return YYYY-MM-DD

Examples snippets:

_x000D_
_x000D_
console.log("1) "+  new Date().toDateString());
console.log("2) "+  new Date().toISOString());
console.log("3) "+  new Date().toJSON());
console.log("4) "+  new Date().toLocaleDateString());
console.log("5) "+  new Date().toLocaleString());
console.log("6) "+  new Date().toLocaleTimeString());
console.log("7) "+  new Date().toString());
console.log("8) "+  new Date().toISOString().slice(0,10));
_x000D_
_x000D_
_x000D_

Specifying the locale for standard functions:

Some of the standard functions listed above are dependent on the locale:

  • toLocaleDateString()
  • toLocaleTimeString()
  • toLocalString()

This is because different cultures make uses of different formats, and express their date or time in different ways. The function by default will return the format configured on the device it runs, but this can be specified by setting the arguments (ECMA-402).

toLocaleDateString([locales[, options]])
toLocaleTimeString([locales[, options]])
toLocaleString([locales[, options]])
//e.g. toLocaleDateString('ko-KR');

The option second parameter, allow for configuring more specific format inside the selected locale. For instance, the month can be show as full-text or abreviation.

toLocaleString('en-GB', { month: 'short' })
toLocaleString('en-GB', { month: 'long' })

Examples snippets:

_x000D_
_x000D_
console.log("1) "+  new Date().toLocaleString('en-US'));
console.log("2) "+  new Date().toLocaleString('ko-KR'));
console.log("3) "+  new Date().toLocaleString('de-CH'));

console.log("4) "+  new Date().toLocaleString('en-GB', { hour12: false }));
console.log("5) "+  new Date().toLocaleString('en-GB', { hour12: true }));
_x000D_
_x000D_
_x000D_

Some good practices regarding locales:

  • Most people don't like their dates to appear in a foreigner format, consequently, keep the default locale whenever possible (over setting 'en-US' everywhere).
  • Implementing conversion from/to UTC can be challenging (considering DST, time-zone not multiple of 1 hour, etc.). Use a well-tested library when possible.
  • Don't assume the locale correlate to a country: several countries have many of them (Canada, India, etc.)
  • Avoid detecting the locale through non-standard ways. Here you can read about the multiple pitfalls: detecting the keyboard layout, detecting the locale by the geographic location, etc..

Using an ECMAScript Edition 6 (ES6/ES2015) string template:

let d = new Date();
let formatted = `${d.getFullYear()}-${d.getMonth() + 1}-${d.getDate()}`;

If you need to change the delimiters:

const delimiter = '/';
let formatted = [d.getFullYear(), d.getMonth() + 1, d.getDate()].join(delimiter);

yy = 2-digit year; yyyy = full year

M = digit month; MM = 2-digit month; MMM = short month name; MMMM = full month name

EEEE = full weekday name; EEE = short weekday name

d = digit day; dd = 2-digit day

h = hours; hh = 2-digit hours

m = minutes; mm = 2-digit minutes

s = seconds; ss = 2-digit seconds

S = miliseconds

Used similar formating as Class SimpleDateFormat (Java)

_x000D_
_x000D_
var monthNames = [_x000D_
  "January", "February", "March", "April", "May", "June", "July",_x000D_
  "August", "September", "October", "November", "December"_x000D_
];_x000D_
var dayOfWeekNames = [_x000D_
  "Sunday", "Monday", "Tuesday",_x000D_
  "Wednesday", "Thursday", "Friday", "Saturday"_x000D_
];_x000D_
function formatDate(date, formatStr){_x000D_
    if (!formatStr) {_x000D_
      formatStr = 'dd/mm/yyyy';_x000D_
    }_x000D_
    var day = date.getDate(),_x000D_
        month = date.getMonth(),_x000D_
        year = date.getFullYear(),_x000D_
        hour = date.getHours(),_x000D_
        minute = date.getMinutes(),_x000D_
        second = date.getSeconds(),_x000D_
        miliseconds = date.getMilliseconds(),_x000D_
        hh = twoDigitPad(hour),_x000D_
        mm = twoDigitPad(minute),_x000D_
        ss = twoDigitPad(second),_x000D_
        EEEE = dayOfWeekNames[date.getDay()],_x000D_
        EEE = EEEE.substr(0, 3),_x000D_
        dd = twoDigitPad(day),_x000D_
        M = month + 1,_x000D_
        MM = twoDigitPad(M),_x000D_
        MMMM = monthNames[month],_x000D_
        MMM = MMMM.substr(0, 3),_x000D_
        yyyy = year + "",_x000D_
        yy = yyyy.substr(2, 2)_x000D_
    ;_x000D_
    return formatStr_x000D_
      .replace('hh', hh).replace('h', hour)_x000D_
      .replace('mm', mm).replace('m', minute)_x000D_
      .replace('ss', ss).replace('s', second)_x000D_
      .replace('S', miliseconds)_x000D_
      .replace('dd', dd).replace('d', day)_x000D_
      .replace('MMMM', MMMM).replace('MMM', MMM).replace('MM', MM).replace('M', M)_x000D_
      .replace('EEEE', EEEE).replace('EEE', EEE)_x000D_
      .replace('yyyy', yyyy)_x000D_
      .replace('yy', yy)_x000D_
    ;_x000D_
}_x000D_
function twoDigitPad(num) {_x000D_
    return num < 10 ? "0" + num : num;_x000D_
}_x000D_
console.log(formatDate(new Date()));_x000D_
console.log(formatDate(new Date(), 'EEEE, MMMM d, yyyy hh:mm:ss:S'));_x000D_
console.log(formatDate(new Date(), 'EEE, MMM d, yyyy hh:mm'));_x000D_
console.log(formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss:S'));_x000D_
console.log(formatDate(new Date(), 'yy-MM-dd hh:mm'));
_x000D_
_x000D_
_x000D_


This can help:

export const formatDateToString = date => {
    if (!date) {
        return date;
    }
    try {
        return format(parse(date, 'yyyy-MM-dd', new Date()), 'dd/MM/yyyy');
    } catch (error) {
        return 'invalid date';
    }
};

This is how I implemented for my npm plugins

var monthNames = [
  "January", "February", "March",
  "April", "May", "June", "July",
  "August", "September", "October",
  "November", "December"
];

var Days = [
  "Sunday", "Monday", "Tuesday", "Wednesday",
  "Thursday", "Friday", "Saturday"
];

var formatDate = function(dt,format){
  format = format.replace('ss', pad(dt.getSeconds(),2));
  format = format.replace('s', dt.getSeconds());
  format = format.replace('dd', pad(dt.getDate(),2));
  format = format.replace('d', dt.getDate());
  format = format.replace('mm', pad(dt.getMinutes(),2));
  format = format.replace('m', dt.getMinutes());
  format = format.replace('MMMM', monthNames[dt.getMonth()]);
  format = format.replace('MMM', monthNames[dt.getMonth()].substring(0,3));
  format = format.replace('MM', pad(dt.getMonth()+1,2));
  format = format.replace(/M(?![ao])/, dt.getMonth()+1);
  format = format.replace('DD', Days[dt.getDay()]);
  format = format.replace(/D(?!e)/, Days[dt.getDay()].substring(0,3));
  format = format.replace('yyyy', dt.getFullYear());
  format = format.replace('YYYY', dt.getFullYear());
  format = format.replace('yy', (dt.getFullYear()+"").substring(2));
  format = format.replace('YY', (dt.getFullYear()+"").substring(2));
  format = format.replace('HH', pad(dt.getHours(),2));
  format = format.replace('H', dt.getHours());
  return format;
}

pad = function(n, width, z) {
  z = z || '0';
  n = n + '';
  return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
}

As of 2019, it looks like you can get toLocaleDateString to return only certain parts and then you can join them as you wish:

var date = new Date();

console.log(date.toLocaleDateString("en-US", { day: 'numeric' }) 
            + "-"+ date.toLocaleDateString("en-US", { month: 'short' })
            + "-" + date.toLocaleDateString("en-US", { year: 'numeric' }) );

> 16-Nov-2019

console.log(date.toLocaleDateString("en-US", { month: 'long' }) 
            + " " + date.toLocaleDateString("en-US", { day: 'numeric' }) 
            + ", " + date.toLocaleDateString("en-US", { year: 'numeric' }) );

> November 16, 2019

2.39KB minified. One file. https://github.com/rhroyston/clock-js

10-Aug-2010 would be:

var str = clock.month
str.charAt(0).toUpperCase() + str.slice(1,3); //gets you "Aug"
console.log(clock.day + '-' + str + '-' + clock.year); //gets you 10-Aug-2010




Other way that you can format the date:

function formatDate(dDate,sMode){
    var today = dDate;
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();
    if(dd<10) {
        dd = '0'+dd
    }
    if(mm<10) {
        mm = '0'+mm
    }
    if (sMode+""==""){
        sMode = "dd/mm/yyyy";
    }
    if (sMode == "yyyy-mm-dd"){
        return  yyyy + "-" + mm + "-" + dd + "";
    }
    if (sMode == "dd/mm/yyyy"){
        return  dd + "/" + mm + "/" + yyyy;
    }
}

Here's is some code I just wrote to handle the date formatting for a project I'm working on. It mimics the PHP date formatting functionality to suit my needs. Feel free to use it, it's just extending the already existing Date() object. This may not be the most elegant solution but it's working for my needs.

var d = new Date(); 
d_string = d.format("m/d/Y h:i:s");

/**************************************
 * Date class extension
 * 
 */
    // Provide month names
    Date.prototype.getMonthName = function(){
        var month_names = [
                            'January',
                            'February',
                            'March',
                            'April',
                            'May',
                            'June',
                            'July',
                            'August',
                            'September',
                            'October',
                            'November',
                            'December'
                        ];

        return month_names[this.getMonth()];
    }

    // Provide month abbreviation
    Date.prototype.getMonthAbbr = function(){
        var month_abbrs = [
                            'Jan',
                            'Feb',
                            'Mar',
                            'Apr',
                            'May',
                            'Jun',
                            'Jul',
                            'Aug',
                            'Sep',
                            'Oct',
                            'Nov',
                            'Dec'
                        ];

        return month_abbrs[this.getMonth()];
    }

    // Provide full day of week name
    Date.prototype.getDayFull = function(){
        var days_full = [
                            'Sunday',
                            'Monday',
                            'Tuesday',
                            'Wednesday',
                            'Thursday',
                            'Friday',
                            'Saturday'
                        ];
        return days_full[this.getDay()];
    };

    // Provide full day of week name
    Date.prototype.getDayAbbr = function(){
        var days_abbr = [
                            'Sun',
                            'Mon',
                            'Tue',
                            'Wed',
                            'Thur',
                            'Fri',
                            'Sat'
                        ];
        return days_abbr[this.getDay()];
    };

    // Provide the day of year 1-365
    Date.prototype.getDayOfYear = function() {
        var onejan = new Date(this.getFullYear(),0,1);
        return Math.ceil((this - onejan) / 86400000);
    };

    // Provide the day suffix (st,nd,rd,th)
    Date.prototype.getDaySuffix = function() {
        var d = this.getDate();
        var sfx = ["th","st","nd","rd"];
        var val = d%100;

        return (sfx[(val-20)%10] || sfx[val] || sfx[0]);
    };

    // Provide Week of Year
    Date.prototype.getWeekOfYear = function() {
        var onejan = new Date(this.getFullYear(),0,1);
        return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
    } 

    // Provide if it is a leap year or not
    Date.prototype.isLeapYear = function(){
        var yr = this.getFullYear();

        if ((parseInt(yr)%4) == 0){
            if (parseInt(yr)%100 == 0){
                if (parseInt(yr)%400 != 0){
                    return false;
                }
                if (parseInt(yr)%400 == 0){
                    return true;
                }
            }
            if (parseInt(yr)%100 != 0){
                return true;
            }
        }
        if ((parseInt(yr)%4) != 0){
            return false;
        } 
    };

    // Provide Number of Days in a given month
    Date.prototype.getMonthDayCount = function() {
        var month_day_counts = [
                                    31,
                                    this.isLeapYear() ? 29 : 28,
                                    31,
                                    30,
                                    31,
                                    30,
                                    31,
                                    31,
                                    30,
                                    31,
                                    30,
                                    31
                                ];

        return month_day_counts[this.getMonth()];
    } 

    // format provided date into this.format format
    Date.prototype.format = function(dateFormat){
        // break apart format string into array of characters
        dateFormat = dateFormat.split("");

        var date = this.getDate(),
            month = this.getMonth(),
            hours = this.getHours(),
            minutes = this.getMinutes(),
            seconds = this.getSeconds();
        // get all date properties ( based on PHP date object functionality )
        var date_props = {
            d: date < 10 ? '0'+date : date,
            D: this.getDayAbbr(),
            j: this.getDate(),
            l: this.getDayFull(),
            S: this.getDaySuffix(),
            w: this.getDay(),
            z: this.getDayOfYear(),
            W: this.getWeekOfYear(),
            F: this.getMonthName(),
            m: month < 10 ? '0'+(month+1) : month+1,
            M: this.getMonthAbbr(),
            n: month+1,
            t: this.getMonthDayCount(),
            L: this.isLeapYear() ? '1' : '0',
            Y: this.getFullYear(),
            y: this.getFullYear()+''.substring(2,4),
            a: hours > 12 ? 'pm' : 'am',
            A: hours > 12 ? 'PM' : 'AM',
            g: hours % 12 > 0 ? hours % 12 : 12,
            G: hours > 0 ? hours : "12",
            h: hours % 12 > 0 ? hours % 12 : 12,
            H: hours,
            i: minutes < 10 ? '0' + minutes : minutes,
            s: seconds < 10 ? '0' + seconds : seconds           
        };

        // loop through format array of characters and add matching data else add the format character (:,/, etc.)
        var date_string = "";
        for(var i=0;i<dateFormat.length;i++){
            var f = dateFormat[i];
            if(f.match(/[a-zA-Z]/g)){
                date_string += date_props[f] ? date_props[f] : '';
            } else {
                date_string += f;
            }
        }

        return date_string;
    };
/*
 *
 * END - Date class extension
 * 
 ************************************/

This library can format the date object and parse the formatted string back to Date object. It uses Java format (SimpleDateFormat class). The name of months and days can be localized.

http://www.javascriptsource.com/repository/javascripts/2009/03/880961/JS_Simple_Date_Format.zip

Example:

var sdf = new JsSimpleDateFormat("dd-MMM-yyyy");
var formattedString = sdf.format(new Date());
var dateObject = sdf.parse("10-Aug-2010");

Here is a script that does exactly what you want

https://github.com/UziTech/js-date-format

var d = new Date("2010-8-10");
document.write(d.format("DD-MMM-YYYY"));

You should have a look at DayJs It's a remake of momentJs but modular architecture oriented so lighter.

Fast 2kB alternative to Moment.js with the same modern API

Day.js is a minimalist JavaScript library that parses, validates, manipulates, and displays dates and times for modern browsers with a largely Moment.js-compatible API. If you use Moment.js, you already know how to use Day.js.

_x000D_
_x000D_
var date = Date.now();_x000D_
const formatedDate = dayjs(date).format("YYYY-MM-DD")_x000D_
console.log(formatedDate);
_x000D_
<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.8.16/dayjs.min.js" crossorigin="anonymous"></script>
_x000D_
_x000D_
_x000D_


This may help with the problem:

_x000D_
_x000D_
var d = new Date();_x000D_
_x000D_
var options = {   _x000D_
    day: 'numeric',_x000D_
    month: 'long', _x000D_
    year: 'numeric'_x000D_
};_x000D_
_x000D_
console.log(d.toLocaleDateString('en-ZA', options));
_x000D_
_x000D_
_x000D_

Date to locate format


In order to format a date as e.g. 10-Aug-2010, you might want to use .toDateString() and ES6 array destructuring.

const formattedDate = new Date().toDateString()
// The above yields e.g. 'Mon Jan 06 2020'

const [, month, day, year] = formattedDate.split(' ')

const ddMmmYyyy = `${day}-${month}-${year}`
// or
const ddMmmYyyy = [day, month, year].join('-')

Two pure JS one-liners

In this answer I develop JD Smith idea. I was able to shorten the JD Smith regexp

_x000D_
_x000D_
let format= d=> d.toString().replace(/\w+ (\w+) (\d+) (\d+).*/,'$2-$1-$3');_x000D_
_x000D_
console.log( format(Date()) );
_x000D_
_x000D_
_x000D_

Dave also base on JD Smith idea but he avoid regexp and give very nice solution - I short a little his solution (by change split param) and opaque it in wrapper

_x000D_
_x000D_
let format= (d,a=d.toString().split` `)=> a[2]+"-"+a[1]+"-"+a[3];_x000D_
_x000D_
console.log( format(Date()) );
_x000D_
_x000D_
_x000D_


Use the date.format library:

var dateFormat = require('dateformat');
var now = new Date();
dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");

returns:

Saturday, June 9th, 2007, 5:46:21 PM 

dateformat on npm

http://jsfiddle.net/phZr7/1/


Requested format in one line - no libraries and no Date methods, just regex:

var d = (new Date()).toString().replace(/\S+\s(\S+)\s(\d+)\s(\d+)\s.*/,'$2-$1-$3');
// date will be formatted as "14-Oct-2015" (pass any date object in place of 'new Date()')

In my testing, this works reliably in the major browsers (Chrome, Safari, Firefox and IE.) As @RobG pointed out, the output of Date.prototype.toString() is implementation-dependent, so for international or non-browser implementations, just test the output to be sure it works right in your JavaScript engine. You can even add some code to test the string output and make sure it's matching what you expect before you do the regex replace.


To obtain "10-Aug-2010", try:

var date = new Date('2010-08-10 00:00:00');
date = date.toLocaleDateString(undefined, {day:'2-digit'}) + '-' + date.toLocaleDateString(undefined, {month:'short'}) + '-' + date.toLocaleDateString(undefined, {year:'numeric'})

For browser support, see toLocaleDateString.


I think you can just use the non-standard Date method toLocaleFormat(formatString)

formatString: A format string in the same format expected by the strftime() function in C.

var today = new Date();
today.toLocaleFormat('%d-%b-%Y'); // 30-Dec-2011

References:


A simple function that can return the date, the date + time, or just the time:

var myDate = dateFormatter("2019-01-24 11:33:24", "date-time");
// >> RETURNS "January 24, 2019 11:33:24"

var myDate2 = dateFormatter("2019-01-24 11:33:24", "date");
// >> RETURNS "January 24, 2019"

var myDate3 = dateFormatter("2019-01-24 11:33:24", "time");
// >> RETURNS "11:33:24"


function dateFormatter(strDate, format){
    var theDate = new Date(strDate);
    if (format=="time")
       return getTimeFromDate(theDate);
    else{
       var dateOptions = {year:'numeric', month:'long', day:'numeric'};
       var formattedDate = theDate.toLocaleDateString("en-US", + dateOptions);
       if (format=="date")
           return formattedDate;
       return formattedDate + " " + getTimeFromDate(theDate);
    }
}

function getTimeFromDate(theDate){
    var sec = theDate.getSeconds();
    if (sec<10)
        sec = "0" + sec;
    var min = theDate.getMinutes();
    if (min<10)
        min = "0" + min;
    return theDate.getHours() + ':'+ min + ':' + sec;
}


There is a new library, smarti.to.js, for localized formatting of JavaScript numbers, dates and JSON dates (Microsoft or ISO8601).

Example:

new Date('2015-1-1').to('dd.MM.yy')         // Outputs 01.01.2015
"2015-01-01T10:11:12.123Z".to('dd.MM.yy')   // Outputs 01.01.2015

There are also custom short patterns defined in the localization file (smarti.to.{culture}.js). Example (smarti.to.et-EE.js):

new Date('2015-1-1').to('d')                // Outputs 1.01.2015

And a multiformatting ability:

smarti.format('{0:n2} + {1:n2} = {2:n2}', 1, 2, 3)   // Output: 1,00 + 2,00 = 3,00

You should have a look at date.js. It adds many convenient helpers for working with dates, for example, in your case:

var date = Date.parse('2010-08-10');
console.log(date.toString('dd-MMM-yyyy'));

Getting started: http://www.datejs.com/2007/11/27/getting-started-with-datejs/


Sugar.js has excellent extensions to the Date object, including a Date.format method.

Examples from the documentation:

Date.create().format('{Weekday} {Month} {dd}, {yyyy}');

Date.create().format('{12hr}:{mm}{tt}')

DateFormatter.formatDate(new Date(2010,7,10), 'DD-MMM-YYYY')

=>10-Aug-2010

DateFormatter.formatDate(new Date(), 'YYYY-MM-DD HH:mm:ss')

=>2017-11-22 19:52:37

DateFormatter.formatDate(new Date(2005, 1, 2, 3, 4, 5), 'D DD DDD DDDD, M MM MMM MMMM, YY YYYY, h hh H HH, m mm, s ss, a A')

=>2 02 Wed Wednesday, 2 02 Feb February, 05 2005, 3 03 3 03, 4 04, 5 05, am AM

_x000D_
_x000D_
var DateFormatter = {_x000D_
  monthNames: [_x000D_
    "January", "February", "March", "April", "May", "June",_x000D_
    "July", "August", "September", "October", "November", "December"_x000D_
  ],_x000D_
  dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],_x000D_
  formatDate: function (date, format) {_x000D_
    var self = this;_x000D_
    format = self.getProperDigits(format, /d+/gi, date.getDate());_x000D_
    format = self.getProperDigits(format, /M+/g, date.getMonth() + 1);_x000D_
    format = format.replace(/y+/gi, function (y) {_x000D_
      var len = y.length;_x000D_
      var year = date.getFullYear();_x000D_
      if (len == 2)_x000D_
        return (year + "").slice(-2);_x000D_
      else if (len == 4)_x000D_
        return year;_x000D_
      return y;_x000D_
    })_x000D_
    format = self.getProperDigits(format, /H+/g, date.getHours());_x000D_
    format = self.getProperDigits(format, /h+/g, self.getHours12(date.getHours()));_x000D_
    format = self.getProperDigits(format, /m+/g, date.getMinutes());_x000D_
    format = self.getProperDigits(format, /s+/gi, date.getSeconds());_x000D_
    format = format.replace(/a/ig, function (a) {_x000D_
      var amPm = self.getAmPm(date.getHours())_x000D_
      if (a === 'A')_x000D_
        return amPm.toUpperCase();_x000D_
      return amPm;_x000D_
    })_x000D_
    format = self.getFullOr3Letters(format, /d+/gi, self.dayNames, date.getDay())_x000D_
    format = self.getFullOr3Letters(format, /M+/g, self.monthNames, date.getMonth())_x000D_
    return format;_x000D_
  },_x000D_
  getProperDigits: function (format, regex, value) {_x000D_
    return format.replace(regex, function (m) {_x000D_
      var length = m.length;_x000D_
      if (length == 1)_x000D_
        return value;_x000D_
      else if (length == 2)_x000D_
        return ('0' + value).slice(-2);_x000D_
      return m;_x000D_
    })_x000D_
  },_x000D_
  getHours12: function (hours) {_x000D_
    // https://stackoverflow.com/questions/10556879/changing-the-1-24-hour-to-1-12-hour-for-the-gethours-method_x000D_
    return (hours + 24) % 12 || 12;_x000D_
  },_x000D_
  getAmPm: function (hours) {_x000D_
    // https://stackoverflow.com/questions/8888491/how-do-you-display-javascript-datetime-in-12-hour-am-pm-format_x000D_
    return hours >= 12 ? 'pm' : 'am';_x000D_
  },_x000D_
  getFullOr3Letters: function (format, regex, nameArray, value) {_x000D_
    return format.replace(regex, function (s) {_x000D_
      var len = s.length;_x000D_
      if (len == 3)_x000D_
        return nameArray[value].substr(0, 3);_x000D_
      else if (len == 4)_x000D_
        return nameArray[value];_x000D_
      return s;_x000D_
    })_x000D_
  }_x000D_
}_x000D_
_x000D_
console.log(DateFormatter.formatDate(new Date(), 'YYYY-MM-DD HH:mm:ss'));_x000D_
console.log(DateFormatter.formatDate(new Date(), 'D DD DDD DDDD, M MM MMM MMMM, YY YYYY, h hh H HH, m mm, s ss, a A'));_x000D_
console.log(DateFormatter.formatDate(new Date(2005, 1, 2, 3, 4, 5), 'D DD DDD DDDD, M MM MMM MMMM, YY YYYY, h hh H HH, m mm, s ss, a A'));
_x000D_
_x000D_
_x000D_

The format description was taken from Ionic Framework (it does not support Z, UTC Timezone Offset)

Not thoroughly tested


This Module can easily handle mostly every case there is. It is part of a bigger npm package, by Locutus, which includes a variety of functions, but can be used totally independent of the package it self, just copy paste/ adapt a little if not working with npm (change from module to just a function)

As a second parameter it accepts a timestamp, which can come from anywhere, such as Date.getTime()

Also, Locutus maintains a bigger datetime module, also inside the locutus package which will give a more object oriented way to use it

Here you can see other datetime functions, as modules, that proved to be very usefull too.

You can find documentation on parameters and format strings here (note that the doc site is a php site, but the locutus implementation follows exactly the same specs)

Examples of date Module

date('H:m:s \\m \\i\\s \\m\\o\\n\\t\\h', 1062402400)//'07:09:40 m is month'

date('F j, Y, g:i a', 1062462400)//'September 2, 2003, 12:26 am'

date('Y W o', 1062462400)//'2003 36 2003'

var $x = date('Y m d', (new Date()).getTime() / 1000) $x = $x + '' var $result = $x.length // 2009 01 09    10

date('W', 1104534000)   //'52'

date('B t', 1104534000) //'999 31'

date('W U', 1293750000.82); // 2010-12-31   '52 1293750000'

date('W', 1293836400); // 2011-01-01    '52'

date('W Y-m-d', 1293974054); // 2011-01-02  '52 2011-01-02'

A JavaScript solution without using any external libraries:

var now = new Date()
months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
var formattedDate = now.getDate() + "-" + months[now.getMonth()] + "-" + now.getFullYear()
alert(formattedDate)

_x000D_
_x000D_
function convert_month(i = 0, option = "num") { // i = index

  var object_months = [
    { num: 01, short: "Jan", long: "January" },
    { num: 02, short: "Feb", long: "Februari" }, 
    { num: 03, short: "Mar", long: "March" },          
    { num: 04, short: "Apr", long: "April" },
    { num: 05, short: "May", long: "May" },
    { num: 06, short: "Jun", long: "Juni" },
    { num: 07, short: "Jul", long: "July" },
    { num: 08, short: "Aug", long: "August" },
    { num: 09, short: "Sep", long: "September" },
    { num: 10, short: "Oct", long: "October" },
    { num: 11, short: "Nov", long: "November" },
    { num: 12, short: "Dec", long: "December" }
  ];
        
  return object_months[i][option];

}
      
var d = new Date();
      
// https://stackoverflow.com/questions/1408289/how-can-i-do-string-interpolation-in-javascript
var num   = `${d.getDate()}-${convert_month(d.getMonth())}-${d.getFullYear()}`;
var short = `${d.getDate()}-${convert_month(d.getMonth(), "short")}-${d.getFullYear()}`;
var long  = `${d.getDate()}-${convert_month(d.getMonth(), "long")}-${d.getFullYear()}`;

document.querySelector("#num").innerHTML = num;
document.querySelector("#short").innerHTML = short;
document.querySelector("#long").innerHTML = long;
_x000D_
<p>Numeric  : <span id="num"></span> (default)</p>
<p>Short    : <span id="short"></span></p>
<p>Long     : <span id="long"></span></p>
_x000D_
_x000D_
_x000D_


Try this:

_x000D_
_x000D_
function init(){_x000D_
    var d = new Date();_x000D_
    var day = d.getDate();_x000D_
    var x = d.toDateString().substr(4, 3);_x000D_
    var year = d.getFullYear();_x000D_
    document.querySelector("#mydate").innerHTML = day + '-' + x + '-' + year;_x000D_
}_x000D_
window.onload = init;
_x000D_
<div id="mydate"></div>
_x000D_
_x000D_
_x000D_


@Sébastien -- alternative all browser support

new Date(parseInt(496407600)*1000).toLocaleDateString('de-DE', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
}).replace(/\./g, '/');

Documentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString


High-order tagged template literal example based on Date.toLocaleDateString:

const date = new Date(Date.UTC(2020, 4, 2, 3, 23, 16, 738));
const fmt = (dt, lc = "en-US") => (str, ...expr) =>
    str.map((str, i) => str + (expr[i]?dt.toLocaleDateString(lc, expr[i]) :'')).join('')

console.log(fmt(date)`${{year: 'numeric'}}-${{month: '2-digit'}}-${{day: '2-digit'}}`);
// expected output: "2020-05-02"

If you need slightly less control over formatting than the currently accepted answer, Date#toLocaleDateString can be used to create standard locale-specific renderings. The locale and options arguments let applications specify the language whose formatting conventions should be used, and allow some customization of the rendering.

Options key examples:

  1. day:
    The representation of the day.
    Possible values are "numeric", "2-digit".
  2. weekday:
    The representation of the weekday.
    Possible values are "narrow", "short", "long".
  3. year:
    The representation of the year.
    Possible values are "numeric", "2-digit".
  4. month:
    The representation of the month.
    Possible values are "numeric", "2-digit", "narrow", "short", "long".
  5. hour:
    The representation of the hour.
    Possible values are "numeric", "2-digit".
  6. minute: The representation of the minute.
    Possible values are "numeric", "2-digit".
  7. second:
    The representation of the second.
    Possible values are "numeric", 2-digit".

All these keys are optional. You can change the number of options values based on your requirements, and this will also reflect the presence of each date time term.

Note: If you would only like to configure the content options, but still use the current locale, passing null for the first parameter will cause an error. Use undefined instead.

For different languages:

  1. "en-US": For English
  2. "hi-IN": For Hindi
  3. "ja-JP": For Japanese

You can use more language options.

For example

_x000D_
_x000D_
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };_x000D_
var today  = new Date();_x000D_
_x000D_
console.log(today.toLocaleDateString("en-US")); // 9/17/2016_x000D_
console.log(today.toLocaleDateString("en-US", options)); // Saturday, September 17, 2016_x000D_
console.log(today.toLocaleDateString("hi-IN", options)); // ??????, 17 ?????? 2016
_x000D_
_x000D_
_x000D_

You can also use the toLocaleString() method for the same purpose. The only difference is this function provides the time when you don't pass any options.

// Example
9/17/2016, 1:21:34 PM

References:


Well, what I wanted was to convert today's date to a MySQL friendly date string like 2012-06-23, and to use that string as a parameter in one of my queries. The simple solution I've found is this:

var today = new Date().toISOString().slice(0, 10);

Keep in mind that the above solution does not take into account your timezone offset.

You might consider using this function instead:

function toJSONLocal (date) {
    var local = new Date(date);
    local.setMinutes(date.getMinutes() - date.getTimezoneOffset());
    return local.toJSON().slice(0, 10);
}

This will give you the correct date in case you are executing this code around the start/end of the day.


This function I inspired by java's SimpleDateFormat provides various formats such as:

dd-MMM-yyyy ? 17-Jul-2018
yyyyMMdd'T'HHmmssXX ? 20180717T120856+0900
yyyy-MM-dd'T'HH:mm:ssXXX ? 2018-07-17T12:08:56+09:00
E, dd MMM yyyy HH:mm:ss Z ? Tue, 17 Jul 2018 12:08:56 +0900
yyyy.MM.dd 'at' hh:mm:ss Z ? 2018.07.17 at 12:08:56 +0900
EEE, MMM d, ''yy ? Tue, Jul 17, '18
h:mm a ? 12:08 PM
hh 'o''''clock' a, X ? 12 o'clock PM, +09

Code example:

_x000D_
_x000D_
function formatWith(formatStr, date, opts) {_x000D_
    _x000D_
        if (!date) {_x000D_
            date = new Date();_x000D_
        }_x000D_
    _x000D_
        opts = opts || {};_x000D_
    _x000D_
        let _days = opts.days;_x000D_
    _x000D_
        if (!_days) {_x000D_
            _days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];_x000D_
        }_x000D_
    _x000D_
        let _months = opts.months;_x000D_
    _x000D_
        if (!_months) {_x000D_
            _months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];_x000D_
        }_x000D_
    _x000D_
        const pad = (number, strDigits, isUnpad) => {_x000D_
            const strNum = number.toString();_x000D_
            if (!isUnpad && strNum.length > strDigits.length) {_x000D_
                return strNum;_x000D_
            } else {_x000D_
                return ('0000' + strNum).slice(-strDigits.length);_x000D_
            }_x000D_
        };_x000D_
    _x000D_
        const timezone = (date, letter) => {_x000D_
            const chunk = [];_x000D_
            const offset = -date.getTimezoneOffset();_x000D_
            chunk.push(offset === 0 ? 'Z' : offset > 0 ? '+' : '-');//add Z or +,-_x000D_
            if (offset === 0) return chunk;_x000D_
            chunk.push(pad(Math.floor(offset / 60), '00'));//hour_x000D_
            if (letter === 'X') return chunk.join('');_x000D_
            if (letter === 'XXX') chunk.push(':');_x000D_
            chunk.push(pad((offset % 60), '00'));//min_x000D_
            return chunk.join('');_x000D_
        };_x000D_
    _x000D_
        const ESCAPE_DELIM = '\0';_x000D_
        const escapeStack = [];_x000D_
    _x000D_
        const escapedFmtStr = formatStr.replace(/'.*?'/g, m => {_x000D_
            escapeStack.push(m.replace(/'/g, ''));_x000D_
            return ESCAPE_DELIM + (escapeStack.length - 1) + ESCAPE_DELIM;_x000D_
        });_x000D_
    _x000D_
        const formattedStr = escapedFmtStr_x000D_
            .replace(/y{4}|y{2}/g, m => pad(date.getFullYear(), m, true))_x000D_
            .replace(/M{3}/g, m => _months[date.getMonth()])_x000D_
            .replace(/M{1,2}/g, m => pad(date.getMonth() + 1, m))_x000D_
            .replace(/M{1,2}/g, m => pad(date.getMonth() + 1, m))_x000D_
            .replace(/d{1,2}/g, m => pad(date.getDate(), m))_x000D_
            .replace(/H{1,2}/g, m => pad(date.getHours(), m))_x000D_
            .replace(/h{1,2}/g, m => {_x000D_
                const hours = date.getHours();_x000D_
                return pad(hours === 0 ? 12 : hours > 12 ? hours - 12 : hours, m);_x000D_
            })_x000D_
            .replace(/a{1,2}/g, m => date.getHours() >= 12 ? 'PM' : 'AM')_x000D_
            .replace(/m{1,2}/g, m => pad(date.getMinutes(), m))_x000D_
            .replace(/s{1,2}/g, m => pad(date.getSeconds(), m))_x000D_
            .replace(/S{3}/g, m => pad(date.getMilliseconds(), m))_x000D_
            .replace(/[E]+/g, m => _days[date.getDay()])_x000D_
            .replace(/[Z]+/g, m => timezone(date, m))_x000D_
            .replace(/X{1,3}/g, m => timezone(date, m))_x000D_
        ;_x000D_
    _x000D_
        const unescapedStr = formattedStr.replace(/\0\d+\0/g, m => {_x000D_
            const unescaped = escapeStack.shift();_x000D_
            return unescaped.length > 0 ? unescaped : '\'';_x000D_
        });_x000D_
    _x000D_
        return unescapedStr;_x000D_
    }_x000D_
_x000D_
    //Let's format with above function_x000D_
    const dateStr = '2018/07/17 12:08:56';_x000D_
    const date = new Date(dateStr);_x000D_
    const patterns = [_x000D_
        "dd-MMM-yyyy",_x000D_
        "yyyyMMdd'T'HHmmssXX",//ISO8601_x000D_
        "yyyy-MM-dd'T'HH:mm:ssXXX",//ISO8601EX_x000D_
        "E, dd MMM yyyy HH:mm:ss Z",//RFC1123(RFC822) like email_x000D_
        "yyyy.MM.dd 'at' hh:mm:ss Z",//hh shows 1-12_x000D_
        "EEE, MMM d, ''yy",_x000D_
        "h:mm a",_x000D_
        "hh 'o''''clock' a, X",_x000D_
    ];_x000D_
    _x000D_
    _x000D_
    for (let pattern of patterns) {_x000D_
        console.log(`${pattern} ? ${formatWith(pattern, date)}`);_x000D_
    }
_x000D_
_x000D_
_x000D_

And you can use this as a library

Also released as a NPM module.You can use this on node.js or use this from CDN for browser.

nodejs

const {SimpleDateFormat} = require('@riversun/simple-date-format');

on browser

<script src="https://cdn.jsdelivr.net/npm/@riversun/[email protected]/dist/simple-date-format.js"></script>

Write code as follows.

const date = new Date('2018/07/17 12:08:56');
const sdf = new SimpleDateFormat();
console.log(sdf.formatWith("yyyy-MM-dd'T'HH:mm:ssXXX", date));//to be "2018-07-17T12:08:56+09:00"

Source code here on github:

https://github.com/riversun/simple-date-format


Short, widely compatible approach:

function formatDate(date) {
    date.toISOString()
    .replace(/^(\d+)-(\d+)-(\d+).*$/, // Only extract Y-M-D
        function (a,y,m,d) {
            return [
                d, // Day
                ['Jan','Feb','Mar','Apr','May','Jun',  // Month Names
                'Jul','Ago','Sep','Oct','Nov','Dec']
                [m-1], // Month
                y  // Year
            ].join('-') // Stitch together
        })
}

Or, as a single line:

date.toISOString().replace(/^(\d+)-(\d+)-(\d+)T(\d+):(\d+):(\d+).(\d+)Z$/, function (a,y,m,d) {return [d,['Jan','Feb','Mar','Apr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'][m-1],y].join('-')})

For any one looking for a really simple ES6 solution to copy, paste and adopt:

_x000D_
_x000D_
const dateToString = d => `${d.getFullYear()}-${('00' + (d.getMonth() + 1)).slice(-2)}-${('00' + d.getDate()).slice(-2)}` _x000D_
_x000D_
// how to use:_x000D_
const myDate = new Date(Date.parse('04 Dec 1995 00:12:00 GMT'))_x000D_
console.log(dateToString(myDate)) // 1995-12-04
_x000D_
_x000D_
_x000D_


If you are already using ExtJS in your project you could use Ext.Date:

var date = new Date();
Ext.Date.format(date, "d-M-Y");

returns:

"11-Nov-2015"

Use:

thisDate = new Date(parseInt(jsonDateString.replace('/Date(', '')));
formattedDate = (thisDate.getMonth() + 1) + "/" + (thisDate.getDate()+1) + "/" + thisDate.getFullYear();

This takes a JSON date, "/Date(1429573751663)/" and produces as the formatted string:

"4/21/2015"


You don't need any libraries. Just extract date components and construct the string. Here is how to get YYYY-MM-DD format. Also note the month index "January is 0, February is 1, and so on."

// @flow

type Components = {
  day: number,
  month: number,
  year: number
}

export default class DateFormatter {
  // YYYY-MM-DD
  static YYYY_MM_DD = (date: Date): string => {
    const components = DateFormatter.format(DateFormatter.components(date))
    return `${components.year}-${components.month}-${components.day}`
  }

  static format = (components: Components) => {
    return {
      day: `${components.day}`.padStart(2, '0'),
      month: `${components.month}`.padStart(2, '0'),
      year: components.year
    }
  }

  static components = (date: Date) => {
    return {
      day: date.getDate(),
      month: date.getMonth() + 1,
      year: date.getFullYear()
    }
  }
}

The following code will allow you to format the date to either DD-MM-YYYY (27-12-2017) or DD MMM YYYY (27 Dec 2017) :

/** Pad number to fit into nearest power of 10 */
function padNumber(number, prependChar, count) {
  var out = '' + number; var i;
  if (number < Math.pow(10, count))
    while (out.length < ('' + Math.pow(10, count)).length) out = prependChar + out;

  return out;
}

/* Format the date to 'DD-MM-YYYY' or 'DD MMM YYYY' */
function dateToDMY(date, useNumbersOnly) {
  var months = [
    'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 
    'Nov', 'Dec'
  ];

  return '' + padNumber(date.getDate(), '0', 1) + 
   (useNumbersOnly? '-' + padNumber(date.getMonth() + 1, '0', 1) + '-' : ' ' + months[date.getMonth()] + ' ')
    + date.getFullYear();
}

Change the order of date.getFullYear() and padNumber(date.getDate(), '0', 1) to make a dateToYMD() function.

See repl.it example for details.


_x000D_
_x000D_
new Date().toLocaleDateString()_x000D_
_x000D_
// "3/21/2018"
_x000D_
_x000D_
_x000D_

More documentation at developer.mozilla.org


Packaged Solution: Luxon

If you want to use a one solution to fit all, I highly recommend using Luxon (a modernized version of Moment.js) which also does formatting in many locales/languages and tons of other features.

Luxon is hosted on the Moment.js website and developed by a Moment.js developer because Moment.js has limitations that the developer wanted to address but couldn't.

To install:

npm install luxon or yarn add luxon (visit link for other installation methods)

Example:

luxon.DateTime.fromISO('2010-08-10').toFormat('yyyy-LLL-dd');

Yields:

10-Aug-2010

Manual Solution

Using similar formatting as Moment.js, Class DateTimeFormatter (Java), and Class SimpleDateFormat (Java), I implemented a comprehensive solution formatDate(date, patternStr) where the code is easy to read and modify. You can display date, time, AM/PM, etc. See code for more examples.

Example:

formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss:S')

(formatDate is implemented in the code snippet below)

Yields:

Friday, October 12, 2018 18:11:23:445

Try the code out by clicking "Run code snippet."

Date and Time Patterns

yy = 2-digit year; yyyy = full year

M = digit month; MM = 2-digit month; MMM = short month name; MMMM = full month name

EEEE = full weekday name; EEE = short weekday name

d = digit day; dd = 2-digit day

h = hours am/pm; hh = 2-digit hours am/pm; H = hours; HH = 2-digit hours

m = minutes; mm = 2-digit minutes; aaa = AM/PM

s = seconds; ss = 2-digit seconds

S = miliseconds

_x000D_
_x000D_
var monthNames = [_x000D_
  "January", "February", "March", "April", "May", "June", "July",_x000D_
  "August", "September", "October", "November", "December"_x000D_
];_x000D_
var dayOfWeekNames = [_x000D_
  "Sunday", "Monday", "Tuesday",_x000D_
  "Wednesday", "Thursday", "Friday", "Saturday"_x000D_
];_x000D_
function formatDate(date, patternStr){_x000D_
    if (!patternStr) {_x000D_
        patternStr = 'M/d/yyyy';_x000D_
    }_x000D_
    var day = date.getDate(),_x000D_
        month = date.getMonth(),_x000D_
        year = date.getFullYear(),_x000D_
        hour = date.getHours(),_x000D_
        minute = date.getMinutes(),_x000D_
        second = date.getSeconds(),_x000D_
        miliseconds = date.getMilliseconds(),_x000D_
        h = hour % 12,_x000D_
        hh = twoDigitPad(h),_x000D_
        HH = twoDigitPad(hour),_x000D_
        mm = twoDigitPad(minute),_x000D_
        ss = twoDigitPad(second),_x000D_
        aaa = hour < 12 ? 'AM' : 'PM',_x000D_
        EEEE = dayOfWeekNames[date.getDay()],_x000D_
        EEE = EEEE.substr(0, 3),_x000D_
        dd = twoDigitPad(day),_x000D_
        M = month + 1,_x000D_
        MM = twoDigitPad(M),_x000D_
        MMMM = monthNames[month],_x000D_
        MMM = MMMM.substr(0, 3),_x000D_
        yyyy = year + "",_x000D_
        yy = yyyy.substr(2, 2)_x000D_
    ;_x000D_
    // checks to see if month name will be used_x000D_
    patternStr = patternStr_x000D_
      .replace('hh', hh).replace('h', h)_x000D_
      .replace('HH', HH).replace('H', hour)_x000D_
      .replace('mm', mm).replace('m', minute)_x000D_
      .replace('ss', ss).replace('s', second)_x000D_
      .replace('S', miliseconds)_x000D_
      .replace('dd', dd).replace('d', day)_x000D_
      _x000D_
      .replace('EEEE', EEEE).replace('EEE', EEE)_x000D_
      .replace('yyyy', yyyy)_x000D_
      .replace('yy', yy)_x000D_
      .replace('aaa', aaa);_x000D_
    if (patternStr.indexOf('MMM') > -1) {_x000D_
        patternStr = patternStr_x000D_
          .replace('MMMM', MMMM)_x000D_
          .replace('MMM', MMM);_x000D_
    }_x000D_
    else {_x000D_
        patternStr = patternStr_x000D_
          .replace('MM', MM)_x000D_
          .replace('M', M);_x000D_
    }_x000D_
    return patternStr;_x000D_
}_x000D_
function twoDigitPad(num) {_x000D_
    return num < 10 ? "0" + num : num;_x000D_
}_x000D_
console.log(formatDate(new Date()));_x000D_
console.log(formatDate(new Date(), 'dd-MMM-yyyy')); //OP's request_x000D_
console.log(formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss.S aaa'));_x000D_
console.log(formatDate(new Date(), 'EEE, MMM d, yyyy HH:mm'));_x000D_
console.log(formatDate(new Date(), 'yyyy-MM-dd HH:mm:ss.S'));_x000D_
console.log(formatDate(new Date(), 'M/dd/yyyy h:mmaaa'));
_x000D_
_x000D_
_x000D_

Thank you @Gerry for bringing up Luxon.


Add the jQuery UI plugin to your page:

function DateFormate(dateFormate, datetime) {
    return $.datepicker.formatDate(dateFormate, datetime);
};

May be this helps some one who are looking for multiple date formats one after the other by willingly or unexpectedly. Please find the code: I am using moment.js format function on a current date as (today is 29-06-2020) var startDate = moment(new Date()).format('MM/DD/YY'); Result: 06/28/20

what happening is it retains only the year part :20 as "06/28/20", after If I run the statement : new Date(startDate) The result is "Mon Jun 28 1920 00:00:00 GMT+0530 (India Standard Time)",

Then, when I use another format on "06/28/20": startDate = moment(startDate ).format('MM-DD-YYYY'); Result: 06-28-1920, in google chrome and firefox browsers it gives correct date on second attempt as: 06-28-2020. But in IE it is having issues, from this I understood we can apply one dateformat on the given date, If we want second date format, it should be apply on the fresh date not on the first date format result. And also observe that for first time applying 'MM-DD-YYYY' and next 'MM-DD-YY' is working in IE. For clear understanding please find my question in the link: Date went wrong when using Momentjs date format in IE 11


Inspired by JD Smith's marvellous regular expression solution, I suddenly had this head-splitting idea:

_x000D_
_x000D_
var D = Date().toString().split(" ");_x000D_
console.log(D[2] + "-" + D[1] + "-" + D[3]);
_x000D_
_x000D_
_x000D_


We have lots of solutions for this, but I think the best of them is Moment.js. So I personally suggest to use Moment.js for date and time operations.

_x000D_
_x000D_
console.log(moment().format('DD-MMM-YYYY'));
_x000D_
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script>
_x000D_
_x000D_
_x000D_


var today = new Date();
var formattedToday = today.toLocaleDateString() + ' ' + today.toLocaleTimeString();

Works same in IE 11, FF & Chrome (Chrome 80.x shows 12 hours format when en-UK selected).

_x000D_
_x000D_
const d = new Date('2010/08/05 23:45') // 26.3.2020_x000D_
const dtfUK = new Intl.DateTimeFormat('UK', { year: 'numeric', month: '2-digit', day: '2-digit',_x000D_
        hour: '2-digit',minute: '2-digit', second: '2-digit' }); //_x000D_
const dtfUS = new Intl.DateTimeFormat('en', { year: 'numeric', month: '2-digit', day: '2-digit',_x000D_
        hour: '2-digit',minute: '2-digit', second: '2-digit' }); //_x000D_
console.log(dtfUS.format(d)); // 08/05/2010 11:45:00 PM_x000D_
console.log(dtfUK.format(d)); // 05.08.2010 23:45:00_x000D_
/* node.js:_x000D_
08/05/2010, 11:45:00 PM_x000D_
2010-08-05 23:45:00_x000D_
*/
_x000D_
_x000D_
_x000D_

What about something more general ?

_x000D_
_x000D_
var d = new Date('2010-08-10T10:34:56.789Z');_x000D_
var str = d.toDateString() + // Tue Aug 10 2010_x000D_
    ' ' + d.toTimeString().split(' ')[0] + // 12:34:56, GMT+0x00 (GMT+0x:00)_x000D_
    ' ' + (d.getMonth() + 101) + // 108_x000D_
    ' ' + d.getMilliseconds(); // 789_x000D_
console.log(str); // Tue Aug 10 2010 12:34:56 108 789_x000D_
console.log(//   $1 Tue  $2 Aug  $3 11     $4 2020 $5 12   $6 34   $7 56    $8 108  $9 789_x000D_
    str.replace(/(\S{3}) (\S{3}) (\d{1,2}) (\d{4}) (\d{2}):(\d{2}):(\d{2}) 1(\d{2}) (\d{1,3})/, '$3-$2-$4 $5:$6.$9 ($1)')_x000D_
); // 10-Aug-2010 12:34.789 (Tue)_x000D_
/*_x000D_
$1: Tue  Week Day string_x000D_
$2: Aug  Month short text_x000D_
$3: 11   Day_x000D_
$4: 2010 Year_x000D_
$5: 12   Hour_x000D_
$6: 34   Minute_x000D_
$7: 56   Seconds_x000D_
$8: 08   Month_x000D_
$9: 789  Milliseconds_x000D_
*/
_x000D_
_x000D_
_x000D_

Or for example 1-line IIFE "library" ;-)

_x000D_
_x000D_
console.log(_x000D_
    (function (frm, d) { return [d.toDateString(), d.toTimeString().split(' ')[0], (d.getMonth() + 101), d.getMilliseconds()].join(' ').replace(/(\S{3}) (\S{3}) (\d{1,2}) (\d{4}) (\d{2}):(\d{2}):(\d{2}) 1(\d{2}) (\d{1,3})/, frm); })_x000D_
    ('$4/$8/$3 $5:$6 ($1)', new Date())_x000D_
);
_x000D_
_x000D_
_x000D_

You can remove useless parts and / or change indexes if you do not need them.


OK, we have got something called Intl which is very useful for formatting a date in JavaScript these days:

Your date as below:

var date = '10/8/2010';

And you change to Date by using new Date() like below:

date = new Date(date);

And now you can format it any way you like using a list of locales like below:

date = new Intl.DateTimeFormat('en-AU').format(date); // Australian date format: "8/10/2010" 


date = new Intl.DateTimeFormat('en-US').format(date); // USA date format: "10/8/2010" 


date = new Intl.DateTimeFormat('ar-EG').format(date);  // Arabic date format: "??/???/????"

If you exactly want the format you mentioned above, you can do:

date = new Date(Date.UTC(2010, 7, 10, 0, 0, 0));
var options = {year: "numeric", month: "short", day: "numeric"};
date = new Intl.DateTimeFormat("en-AU", options).format(date).replace(/\s/g, '-');

And the result is going to be:

"10-Aug-2010"

For more see the Intl API and Intl.DateTimeFormat documentation.


If you are using jQuery UI in your code, there is an inbuilt function called formatDate(). I am using it this way to format today's date:

var testdate = Date();
testdate = $.datepicker.formatDate( "d-M-yy",new Date(testdate));
alert(testdate);

You can see many other examples of formatting date in the jQuery UI documentation.


A useful and flexible way for formatting the DateTimes in JavaScript is Intl.DateTimeFormat:

var date = new Date();
var options = { year: 'numeric', month: 'short', day: '2-digit'};
var _resultDate = new Intl.DateTimeFormat('en-GB', options).format(date);
// The _resultDate is: "12 Oct 2017"
// Replace all spaces with - and then log it.
console.log(_resultDate.replace(/ /g,'-'));

Result Is: "12-Oct-2017"

The date and time formats can be customized using the options argument.

The Intl.DateTimeFormat object is a constructor for objects that enable language sensitive date and time formatting.

Syntax

new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])

Parameters

locales

Optional. A string with a BCP 47 language tag, or an array of such strings. For the general form and interpretation of the locales argument, see the Intl page. The following Unicode extension keys are allowed:

nu
Numbering system. Possible values include: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".
ca
Calendar. Possible values include: "buddhist", "chinese", "coptic", "ethioaa", "ethiopic", "gregory", "hebrew", "indian", "islamic", "islamicc", "iso8601", "japanese", "persian", "roc".

Options

Optional. An object with some or all of the following properties:

localeMatcher

The locale matching algorithm to use. Possible values are "lookup" and "best fit"; the default is "best fit". For information about this option, see the Intl page.

timeZone

The time zone to use. The only value implementations must recognize is "UTC"; the default is the runtime's default time zone. Implementations may also recognize the time zone names of the IANA time zone database, such as "Asia/Shanghai", "Asia/Kolkata", "America/New_York".

hour12

Whether to use 12-hour time (as opposed to 24-hour time). Possible values are true and false; the default is locale dependent.

formatMatcher

The format matching algorithm to use. Possible values are "basic" and "best fit"; the default is "best fit". See the following paragraphs for information about the use of this property.

The following properties describe the date-time components to use in formatted output and their desired representations. Implementations are required to support at least the following subsets:

weekday, year, month, day, hour, minute, second
weekday, year, month, day
year, month, day
year, month
month, day
hour, minute, second
hour, minute

Implementations may support other subsets, and requests will be negotiated against all available subset-representation combinations to find the best match. Two algorithms are available for this negotiation and selected by the formatMatcher property: A fully specified "basic" algorithm and an implementation dependent "best fit" algorithm.

weekday

The representation of the weekday. Possible values are "narrow", "short", "long".

era

The representation of the era. Possible values are "narrow", "short", "long".

year

The representation of the year. Possible values are "numeric", "2-digit".

month

The representation of the month. Possible values are "numeric", "2-digit", "narrow", "short", "long".

day

The representation of the day. Possible values are "numeric", "2-digit".

hour

The representation of the hour. Possible values are "numeric", "2-digit".

minute

The representation of the minute. Possible values are "numeric", "2-digit".

second

The representation of the second. Possible values are "numeric", "2-digit".

timeZoneName

The representation of the time zone name. Possible values are "short", "long". The default value for each date-time component property is undefined, but if all component properties are undefined, then the year, month and day are assumed to be "numeric".

Check Online

More Details


If you fancy a short, human-readable, function - this is easily adjustable to suit you.

The timeStamp parameter is milliseconds from 1970 - it is returned by new Date().getTime() and many other devices...

OK, I changed my mind. I included an extra function for zero padding. Curses!

 function zeroPad(aNumber) {
     return ("0"+aNumber).slice(-2);
 }
 function humanTime(timeStamp) {
    var M = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
    var D = new Date(timeStamp); // 23 Aug 2016 16:45:59 <-- Desired format.
    return D.getDate() + " " + M[D.getMonth()] + " " + D.getFullYear() + " " + D.getHours() + ":" + zeroPad(d.getMinutes()) + ":" + zeroPad(D.getSeconds());
 }

In modern browsers (*), you can just do this:

var today = new Date().toLocaleDateString('en-GB', {
    day : 'numeric',
    month : 'short',
    year : 'numeric'
}).split(' ').join('-');

Output if executed today (january 24??, 2016):

'24-Jan-2016'

(*) According to MDN, "modern browsers" means Chrome 24+, Firefox 29+, Internet Explorer 11, Edge 12+, Opera 15+ & Safari nightly build.


Plain JavaScript is the best pick for small onetimers.

On the other hand, if you need more date stuff, MomentJS is a great solution.

For example:

moment().format('YYYY-MM-DD HH:m:s');     // now() -> 2015-03-24 14:32:20
moment("20111031", "YYYYMMDD").fromNow(); // 3 years ago
moment("20120620", "YYYYMMDD").fromNow(); // 3 years ago
moment().startOf('day').fromNow();        // 11 hours ago
moment().endOf('day').fromNow();          // in 13 hours

I know someone might say that this is silly solution, but it does do the trick by removing the unnecessary information from the date string.

yourDateObject produces:

Wed Dec 13 2017 20:40:40 GMT+0200 (EET)

yourDateObject.toString().slice(0, 15); produces:

Wed Dec 13 2017


I use the following. It is simple and works fine.

 var dtFormat = require('dtformat');
   var today = new Date();
   dtFormat(today, "dddd, mmmm dS, yyyy, h:MM:ss TT");

Or this:

var now = new Date()
months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
var formattedDate = now.getDate()  + "-" + months[now.getMonth()] + "-" + now.getFullYear()
alert(formattedDate)

Examples related to javascript

need to add a class to an element How to make a variable accessible outside a function? Hide Signs that Meteor.js was Used How to create a showdown.js markdown extension Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Summing radio input values How to execute an action before close metro app WinJS javascript, for loop defines a dynamic variable name Getting all files in directory with ajax

Examples related to date

How do I format {{$timestamp}} as MM/DD/YYYY in Postman? iOS Swift - Get the Current Local Time and Date Timestamp Typescript Date Type? how to convert current date to YYYY-MM-DD format with angular 2 SQL Server date format yyyymmdd Date to milliseconds and back to date in Swift Check if date is a valid one change the date format in laravel view page Moment js get first and last day of current month How can I convert a date into an integer?

Examples related to date-formatting

How to insert date values into table How do I format a date as ISO 8601 in moment.js? Java Convert GMT/UTC to Local time doesn't work as expected Compare two date formats in javascript/jquery How to ISO 8601 format a Date with Timezone Offset in JavaScript? What are the "standard unambiguous date" formats for string-to-date conversion in R? How to convert date in to yyyy-MM-dd Format? Convert timestamp to date in MySQL query Date formatting in WPF datagrid Return date as ddmmyyyy in SQL Server