snippetjavascriptCritical
How do I format a date in JavaScript?
Viewed 0 times
formatdatehowjavascript
Problem
How do I format a Javascript
Date object as a string? (Preferable format: 10-Aug-2010)Solution
For custom-delimited date formats, you have to pull out the date (or time)
components from a
ECMAScript Internationalization API), and then manually create a string
with the delimiters you want.
To do this, you can use
destructure the array, but that is not ideal, as the array output depends on the
locale:
Better would be to map a format array to resultant strings:
You can also pull out the parts of a
2020, there is a bug in the ECMAScript implementation when it comes to
leading zeros on minutes and seconds (this bug is circumvented by the approach
above).
When working with dates and times, it is usually worth using a library (eg. luxon, date-fns, moment.js is not recommended for new projects) because of the many hidden complexities of the field.
Note that the ECMAScript Internationalization API, used in the solutions above
is not supported in IE10 (0.03% global browser market share in Feb
2020).
components from a
DateTimeFormat object (which is part of theECMAScript Internationalization API), and then manually create a string
with the delimiters you want.
To do this, you can use
DateTimeFormat#formatToParts. You coulddestructure the array, but that is not ideal, as the array output depends on the
locale:
{ // example 1
let formatter = new Intl.DateTimeFormat('en');
let example = formatter.formatToParts();
console.log(example);
}
{ // example 2
let formatter = new Intl.DateTimeFormat('hi');
let example = formatter.formatToParts();
console.log(example);
}
Better would be to map a format array to resultant strings:
function join(date, options, separator) {
function format(option) {
let formatter = new Intl.DateTimeFormat('en', option);
return formatter.format(date);
}
return options.map(format).join(separator);
}
let options = [{day: 'numeric'}, {month: 'short'}, {year: 'numeric'}];
let joined = join(new Date, options, '-');
console.log(joined);
You can also pull out the parts of a
DateTimeFormat one-by-one usingDateTimeFormat#format, but note that when using this method, as of March2020, there is a bug in the ECMAScript implementation when it comes to
leading zeros on minutes and seconds (this bug is circumvented by the approach
above).
let date = new Date(2010, 7, 5);
let year = new Intl.DateTimeFormat('en', { year: 'numeric' }).format(date);
let month = new Intl.DateTimeFormat('en', { month: 'short' }).format(date);
let day = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(date);
console.log(${day}-${month}-${year});
When working with dates and times, it is usually worth using a library (eg. luxon, date-fns, moment.js is not recommended for new projects) because of the many hidden complexities of the field.
Note that the ECMAScript Internationalization API, used in the solutions above
is not supported in IE10 (0.03% global browser market share in Feb
2020).
Context
Stack Overflow Q#3552461, score: 1756
Revisions (0)
No revisions yet.