Click here to Skip to main content
11,927,711 members (48,580 online)
Click here to Skip to main content
Add your own
alternative version


66 bookmarked

JavaScript Date Format

, 3 Dec 2012 CPOL
Rate this:
Please Sign up or sign in to vote.
A fast VB-like date format function in JavaScript (requires JScript 5.5+).


I needed a JavaScript date format function such as the Visual Basic Format function, in which you can pass a format string; my first approach was to issue a series of consecutive and "destructive" replace calls, but upon discovering that the 5.5 (or higher) version of JScript supported the use of a function as the replaceText argument of the replace method, I got creative.

Here's an example call of what I wanted:

SomeDiv.innerText = (new Date()).format('dddd, mmmm dd, yyyy.');

This would display:

Saturday, July 16, 2005

So in my first approach, I globally and case-insensitively replaced dddd with the corresponding string, which "destroyed" every occurrence, so that later in the code I could replace dd with the date number.

This worked just fine, but I knew that by inspecting the format specifier for a match, I could skip the search of every format specifier; say I only want the month and the date; well, by switching upon the format specifier (or rather "datepart" specifier), the year replacement will never be issued. Get it?

The fun part relies in the use of a function in the replaceText argument of the replace method; this way the $1 property as a function argument always represents the last match.

Other considerations include the format or "datepart" specifiers: none other than yyyy will be parsed as the year; months and days have the usual three flavors of fullname (mmmm), three-letter (mmm) or numeric (mm); hours (hh) can be rectified to the 12-hour format with the a/p specifier, and minutes (nn) and seconds (ss) may also be specified.


WOFA, (Without Further Adou):

// a global month names array
var gsMonthNames = new Array(
// a global day names array
var gsDayNames = new Array(
// the date format prototype
Date.prototype.format = function(f)
    if (!this.valueOf())
        return ' ';

    var d = this;

    return f.replace(/(yyyy|mmmm|mmm|mm|dddd|ddd|dd|hh|nn|ss|a\/p)/gi,
            switch ($1.toLowerCase())
            case 'yyyy': return d.getFullYear();
            case 'mmmm': return gsMonthNames[d.getMonth()];
            case 'mmm':  return gsMonthNames[d.getMonth()].substr(0, 3);
            case 'mm':   return (d.getMonth() + 1).zf(2);
            case 'dddd': return gsDayNames[d.getDay()];
            case 'ddd':  return gsDayNames[d.getDay()].substr(0, 3);
            case 'dd':   return d.getDate().zf(2);
            case 'hh':   return ((h = d.getHours() % 12) ? h : 12).zf(2);
            case 'nn':   return d.getMinutes().zf(2);
            case 'ss':   return d.getSeconds().zf(2);
            case 'a/p':  return d.getHours() < 12 ? 'a' : 'p';


  • A date with a value of 0 returns a non-breaking space.
  • Notice how the d variable is available to the replacement function (but the this object is not).
  • The zf number prototype can be found in Extending JavaScript Objects with Prototypes, where it is called 'zp' for zero padding. It pads a number with zeroes the specified number of times, up to the number's character length, i.e. 2 turns into 02, but 16 remains 16.
  • The regular expression looks for any of the bracketed pattern characters in a two+ sequence, or for the very specific a/p match.
  • Defining names globally helps and serves other purposes, i.e. listing days in a calendar.



This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

hector [.j.] rivas
Software Developer (Senior) Code Authority, Inc.
United States United States
Pride in craftsmanship is my new thing.

You may also be interested in...

Comments and Discussions

Generalhey Pin
Frenaaa3-Dec-06 9:09
memberFrenaaa3-Dec-06 9:09 
GeneralRe: hey Pin
Tor2k8-Dec-06 8:22
memberTor2k8-Dec-06 8:22 
GeneralEasy but useful Pin
Ninghuan25-Apr-06 23:01
memberNinghuan25-Apr-06 23:01 
GeneralC#-like formats Pin
Kjetil Klaussen9-Mar-06 0:15
memberKjetil Klaussen9-Mar-06 0:15 
GeneralZF Pin
Tunez1-Aug-05 2:09
memberTunez1-Aug-05 2:09 
GeneralRe: ZF Pin
Tor2k2-Aug-05 15:00
memberTor2k2-Aug-05 15:00 
GeneralA couple of bugs Pin
Richard Deeming26-Jul-05 8:08
memberRichard Deeming26-Jul-05 8:08 
GeneralRe: A couple of bugs Pin
Tor2k26-Jul-05 11:42
memberTor2k26-Jul-05 11:42 
GeneralRe: A small addition Pin
Dougww5-Aug-05 4:13
memberDougww5-Aug-05 4:13 
GeneralRe: A small addition Pin
Tor2k6-Aug-05 8:16
memberTor2k6-Aug-05 8:16 
GeneralRe: A small addition Pin
Richard Deeming10-Aug-05 3:21
memberRichard Deeming10-Aug-05 3:21 
GeneralRe: A small addition Pin
Tor2k10-Aug-05 7:18
memberTor2k10-Aug-05 7:18 
GeneralRe: A small addition Pin
shadowcreeper20-Apr-09 11:05
membershadowcreeper20-Apr-09 11:05 
GeneralRe: A small addition Pin
Tor2k21-Apr-09 6:47
memberTor2k21-Apr-09 6:47 
GeneralRe: A small addition: string 'choose' io switch Pin
Tor2k8-Aug-05 10:30
memberTor2k8-Aug-05 10:30 
GeneralRe: A small addition: string 'choose' io switch Pin
jsc424-Dec-12 23:37
memberjsc424-Dec-12 23:37 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.151126.1 | Last Updated 3 Dec 2012
Article Copyright 2005 by hector [.j.] rivas
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid