magnetiq.com

Most date formatting implementations use format strings where format specifiers like “mm”, “mmm”, “HH”, etc. are used for selecting different components of a date. Here’s a different approach that allows you to use more human-readable format specifiers (while being rather verbose).

Date.prototype.format = function (fmt) {
	var date = this;

	return fmt.replace(
		/\{([^}:]+)(?::(\d+))?\}/g,
		function (s, comp, pad) {
			var fn = date["get" + comp];

			if (fn) {
				var v = (fn.call(date) +
					(/Month$/.test(comp) ? 1 : 0)).toString();

				return pad && (pad = pad - v.length)
					? new Array(pad + 1).join("0") + v
					: v;
			} else {
				return s;
			}
		});
};

Whatever you enclose inside curly brackets will be used as a format specifier:

var now = new Date();

alert(now.format("This is the year {FullYear}"));
// Output: This is the year 2008

You can also zero-pad values:

alert(now.format("{FullYear}-{Month:2}-{Date:2}"));
// Output: 2008-09-02
alert(now.format("{Hours:2}:{Minutes:2}:{Seconds:2}.{Milliseconds:3}"));
// Output: 15:47:32.156

If an unknown format specifier is used, the format specifier will be used as it is:

alert(now.format("{Hourz} hours {Minutes} minutes"));
// Output: {Hourz} hours 51 minutes

Invalid format specifiers are also handled gracefully:

alert(now.format("{FullYear:}));
// Output: {FullYear:}

Here’s the complete set of format specifiers that are recognized:

Date

Returns the day of the month for the specified date according to local time.

Day

Returns the day of the week for the specified date according to local time.

FullYear

Returns the year of the specified date according to local time.

Hours

Returns the hour in the specified date according to local time.

Milliseconds

Returns the milliseconds in the specified date according to local time.

Minutes

Returns the minutes in the specified date according to local time.

Month

Returns the month in the specified date according to local time.

Seconds

Returns the seconds in the specified date according to local time.

Time

Returns the numeric value of the specified date as the number of milliseconds since January 1, 1970, 00:00:00 UTC.

TimezoneOffset

Returns the time-zone offset in minutes for the current locale.

UTCDate

Returns the day (date) of the month in the specified date according to universal time.

UTCDay

Returns the day of the week in the specified date according to universal time.

UTCFullYear

Returns the year in the specified date according to universal time.

UTCHours

Returns the hours in the specified date according to universal time.

UTCMilliseconds

Returns the milliseconds in the specified date according to universal time.

UTCMinutes

Returns the minutes in the specified date according to universal time.

UTCMonth

Returns the month in the specified date according to universal time.

UTCSeconds

Returns the seconds in the specified date according to universal time.

Namely, all Date instance getters. Month and UTCMonth require special handling since the values they return are zero-based.

This entry was posted on Tuesday, September 2nd, 2008 at 3:09 pm and is filed under JavaScript, Uncategorized.