Seems the most foolproof way to start with a UTC date is to create a new Date object and use the setUTC… methods to set it to the date/time you want.

Then the various toLocale…String methods will provide localized output.

Example:

// This would come from the server.
// Also, this whole block could probably be made into an mktime function.
// All very bare here for quick grasping.
d = new Date();
d.setUTCFullYear(2004);
d.setUTCMonth(1);
d.setUTCDate(29);
d.setUTCHours(2);
d.setUTCMinutes(45);
d.setUTCSeconds(26);

console.log(d);                        // -> Sat Feb 28 2004 23:45:26 GMT-0300 (BRT)
console.log(d.toLocaleString());       // -> Sat Feb 28 23:45:26 2004
console.log(d.toLocaleDateString());   // -> 02/28/2004
console.log(d.toLocaleTimeString());   // -> 23:45:26

Some references:

  • toLocaleString
  • toLocaleDateString
  • toLocaleTimeString
  • getTimezoneOffset
Answer from kch on Stack Overflow
🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleDateString
Date.prototype.toLocaleDateString() - JavaScript | MDN
The toLocaleDateString() method of Date instances returns a string with a language-sensitive representation of the date portion of this date in the local timezone.
🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleTimeString
Date.prototype.toLocaleTimeString() - JavaScript | MDN
const date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); // An application may want to use UTC and make that visible const options = { timeZone: "UTC", timeZoneName: "short" }; console.log(date.toLocaleTimeString("en-US", options)); // "3:00:00 AM GMT" // Sometimes even the US needs 24-hour time console.log(date.toLocaleTimeString("en-US", { hour12: false })); // "19:00:00" // Show only hours and minutes, use options with the default locale - use an empty array console.log( date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }), ); // "20:01" Intl.DateTimeFormat · Date.prototype.toLocaleDateString() Date.prototype.toLocaleString() Date.prototype.toTimeString() Date.prototype.toString() Was this page helpful to you?
🌐
W3Schools
w3schools.com › jsref › jsref_tolocaledatestring.asp
JavaScript Date toLocaleDateString() Method
new Date() constructor getDate() getDay() getFullYear() getHours() getMilliseconds() getMinutes() getMonth() getSeconds() getTime() getTimezoneOffset() getUTCDate() getUTCDay() getUTCFullYear() getUTCHours() getUTCMilliseconds() getUTCMinutes() getUTCMonth() getUTCSeconds() now() parse() prototype setDate() setFullYear() setHours() setMilliseconds() setMinutes() setMonth() setSeconds() setTime() setUTCDate() setUTCFullYear() setUTCHours() setUTCMilliseconds() setUTCMinutes() setUTCMonth() setUTCSeconds() toDateString() toISOString() toJSON() toLocaleDateString() toLocaleTimeString() toLocaleString() toString() toTimeString() toUTCString() UTC() valueOf() JS Function
Top answer
1 of 16
225

Seems the most foolproof way to start with a UTC date is to create a new Date object and use the setUTC… methods to set it to the date/time you want.

Then the various toLocale…String methods will provide localized output.

Example:

// This would come from the server.
// Also, this whole block could probably be made into an mktime function.
// All very bare here for quick grasping.
d = new Date();
d.setUTCFullYear(2004);
d.setUTCMonth(1);
d.setUTCDate(29);
d.setUTCHours(2);
d.setUTCMinutes(45);
d.setUTCSeconds(26);

console.log(d);                        // -> Sat Feb 28 2004 23:45:26 GMT-0300 (BRT)
console.log(d.toLocaleString());       // -> Sat Feb 28 23:45:26 2004
console.log(d.toLocaleDateString());   // -> 02/28/2004
console.log(d.toLocaleTimeString());   // -> 23:45:26

Some references:

  • toLocaleString
  • toLocaleDateString
  • toLocaleTimeString
  • getTimezoneOffset
2 of 16
66

You can do it with moment.js (deprecated in 2021)

It's best to parse your date string from UTC as follows (create an ISO-8601 compatible string on the server to get consistent results across all browsers):

var m = moment("2013-02-08T09:30:26Z");

Now just use m in your application, moment.js defaults to the local timezone for display operations. There are many ways to format the date and time values or extract portions of it.

You can even format a moment object in the users locale like this:

m.format('LLL') // Returns "February 8 2013 8:30 AM" on en-us

To transform a moment.js object into a different timezone (i.e. neither the local one nor UTC), you'll need the moment.js timezone extension. That page has also some examples, it's pretty simple to use.

Note: Moment JS recommends more modern alternatives, so it is probably not a good choice for new projects.

🌐
Peterbe.com
peterbe.com › plog › be-careful-with-date.tolocaledatestring
Be careful with Date.toLocaleDateString() in JavaScript - Peterbe.com
I once made it unnecessarily weird for me in the debugging session, when I figured out about the timeZone option. What I ran was this: Welcome to Node.js v16.13.0. Type ".help" for more information. > new Date('2014-11-27T02:50:49Z').toLocaleDateString("en-us", {day: "numeric", zimeZone: "UTC"}) '26'
🌐
Medium
simonsc.medium.com › working-with-time-zones-in-javascript-1b57e716d273
Working with Time Zones in JavaScript | by Simon SC | Medium
March 15, 2021 - There are plenty of options for the constructor, check the MDN Web Docs for more details. If you are given a date (say, from a JSON file) that’s already timezone encoded, you can pass it into the Date constructor as-is.
🌐
Tabnine
tabnine.com › home page › code › javascript › date
builtins.Date.toLocaleDateString JavaScript and Node.js code examples | Tabnine
function upd() { list.changeDate.header.lastChild.innerHTML = new Date().toLocaleTimeString({}, { hour: '2-digit', minute: '2-digit' }) + ", " + new Date().toLocaleDateString({}, { weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' }); }
🌐
Reality Ripple
udn.realityripple.com › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleDateString
Date.prototype.toLocaleDateString() - JavaScript
// Event for Persian, It's hard to manually convert date to Solar Hijri console.log(date.toLocaleDateString('fa-IR')); // → "۱۳۹۱/۹/۳۰" // Arabic in most Arabic speaking countries uses real Arabic digits console.log(date.toLocaleDateString('ar-EG')); // → "٢٠‏/١٢‏/٢٠١٢" // for Japanese, applications may want to use the Japanese calendar, // where 2012 was the year 24 of the Heisei era console.log(date.toLocaleDateString('ja-JP-u-ca-japanese')); // → "24/12/20" // when requesting a language that may not be supported, such as // Balinese, include a fallback language, in this case Indonesian console.log(date.toLocaleDateString(['ban', 'id'])); // → "20/12/2012"
🌐
GeeksforGeeks
geeksforgeeks.org › javascript-date-tolocaledatestring-method
JavaScript Date toLocaleDateString() Method | GeeksforGeeks
July 12, 2024 - The toLocaleDateString() method in JavaScript is used to convert the date and time of a Date object to a string representing the date portion using the locale-specific conventions.
Find elsewhere
Top answer
1 of 3
1

You might want to check out 10 ways to format time and date using javascript.

You can do something like this, for example, for each of the dates:

var example_date = '2017-09-14T22:11:05.5303556';

function formatDate(date) {
	var d = new Date(date),
		month = d.getMonth(),
		date = d.getDate(),
		year = d.getFullYear(),
		hours = ('0' + d.getHours()).slice(-2),
		minutes = ('0' + d.getMinutes()).slice(-2),
		seconds = ('0' + d.getSeconds()).slice(-2);

    month++;

    return (month + '/' + date +'/' + year + ' ' + hours + ':' + minutes + ':' + seconds);
}

console.log(formatDate(example_date));

You could also make use of .toLocaleTimeString() and .toLocaleDateString() and combine the two.

If you're not averse to using a 3rd party library, I'd recommend taking a gander at MomentJS. It's very good at allowing you to easily format date/time, e.g...

for (var i in json){
  json[i].dateCreated = moment(json[i].dateCreated).format('MM/DD/YYYY hh/mm/ss');
}

...where json is the object returned, would produce:

[{"id":98,"dateCreated":"09/14/2017 10/11/05"},{"id":99,"dateCreated":"09/14/2017 10/11/05"}]
2 of 3
1

I think the new Date(date).toLocaleDateString() would get the job done

Example:

   $.ajax({
        url: 'http://mywebsite/api/Response',
        dataType: 'json',               
        success: function(json) {
           const data = json.map((obj) => (
              Object.assign(
                 {},
                 obj,
                 { dateCreated: new Date(obj.dateCreated).toLocaleDateString() }
              )
           ));

           myTable = $('#my-table').columns({
              data: data,
              schema: [
                 { "header": "ID", "key": "id" },
                 { "header": "Date", "key": "dateCreated" }
              ],                                                          
           });               
        }               
    });

I hope that helps ^__^

🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleString
Date.prototype.toLocaleString() - JavaScript | MDN
// An application may want to use UTC and make that visible options.timeZone = "UTC"; options.timeZoneName = "short"; console.log(date.toLocaleString("en-US", options)); // Example output: "Thursday, December 20, 2012 at UTC" // Sometimes even the US needs 24-hour time console.log(date.toLocaleString("en-US", { hour12: false })); // Example output: "12/19/2012, 19:00:00" // The exact date and time may shift depending on your local time zone. Intl.DateTimeFormat · Date.prototype.toLocaleDateString() Date.prototype.toLocaleTimeString() Date.prototype.toString() Was this page helpful to you? Yes · No Learn how to contribute · This page was last modified on Oct 30, 2025 by MDN contributors. View this page on GitHub • Report a problem with this content
🌐
W3Schools
w3schools.com › jsref › jsref_tolocaletimestring.asp
W3Schools.com
The toLocaleTimeString() method returns the time portion of a date object as a string, using locale conventions.
🌐
Codecademy
codecademy.com › docs › javascript › dates › .tolocaledatestring()
JavaScript | Dates | .toLocaleDateString() | Codecademy
June 2, 2023 - When used without any parameters, .toLocaleDateString() returns a string with the month, day, and year options defaulted to numeric. How they’re arranged and formatted depends on the default locale in which the method was used.
🌐
Droidscript
droidscript.org › javascript › Global_Objects › Date › toLocaleDateString().html
dateObj.toLocaleDateString()
// Arabic in most Arabic speaking countries uses real Arabic digits console.log(date.toLocaleDateString('ar-EG')); // → "٢٠‏/١٢‏/٢٠١٢" // for Japanese, applications may want to use the Japanese calendar, // where 2012 was the year 24 of the Heisei era console.log(date.toLocaleDateString('ja-JP-u-ca-japanese')); // → "24/12/20" // when requesting a language that may not be supported, such as // Balinese, include a fallback language, in this case Indonesian console.log(date.toLocaleDateString(['ban', 'id'])); // → "20/12/2012"
🌐
Delicious-insights
delicious-insights.com › en › posts › js-protip-date-formatting
JS protip: Formatting a date/time according to locale • Delicious Insights
// ⚠️ Only do this for one-off needs! const when = new Date(2022, 9, 26, 9) when.toLocaleString('fr-FR') // => '26/10/2022 09:00:00' when.toLocaleDateString('fr-FR') // => ''26/10/2022' when.toLocaleTimeString('fr-FR') // => '09:00:00' when.toLocaleString('fr-FR', { dateStyle: 'long', timeStyle: 'short' }) // => '26 octobre 2022 à 09:00 ' when.toLocaleDateString('fr-FR', { dateStyle: 'full' }) // => 'mercredi 26 octobre 2022' when.toLocaleTimeString('fr-FR', { timeStyle: 'medium' }) // => '09:00:00' You’re in luck: we’ve got two complementary protips coming up about date/time ranges and time distances, scheduled for tomorrow and the next day! Well, everywhere. Taking into account everything in this 3-protips series, you’re good to go with any browser released in, say, the past 3 years, plus Node 13+ and Deno 1.8+. So go for it!
🌐
W3cubDocs
docs.w3cub.com › javascript › global_objects › date › tolocaledatestring
Date.toLocaleDateString - JavaScript - W3cubDocs
The toLocaleDateString() method of Date instances returns a string with a language-sensitive representation of the date portion of this date in the local timezone.
🌐
TutorialsPoint
tutorialspoint.com › javascript › date_tolocaledatestring.htm
JavaScript Date toLocaleDateString() Method
In JavaScript, the Date.toLocaleDateString() method is used to convert a date object to a string, representing the date portion of the date according to the current locale format.
🌐
Medium
medium.com › geekculture › level-up-your-date-and-time-formatting-skills-in-javascript-866d8b656092
Level Up Your Date and Time Formatting Skills in JavaScript | by Danielle Dias | Geek Culture | Medium
May 26, 2023 - In addition to the specific date ... get a localized string representation of the full date and time, we can use toLocaleString() without any parameters....
🌐
Medium
medium.com › swlh › use-tolocaledatestring-to-format-javascript-dates-2959108ea020
Use toLocaleDateString to Format JavaScript Dates | by John Au-Yeung | The Startup | Medium
April 5, 2020 - The toLocaleString method returns a string with a language sensitive representation of the date portion of the Date object that it’s being called on. The locales and options arguments let applications specify the language that should be used to format the dates and set other options to format dates as we wish. ... const date = new Date(2019,1,1,1,1,1); const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; console.log(date.toLocaleDateString('de-DE', options));