JavaScript new Date Ordinal (st, nd, rd, th)

Question

If at all possible, without JavaScript libraries or lots of clunky code I am looking for the simplest way to format a date two weeks from now in the following format:

13th March 2013

The code I am using is:

var newdate = new Date(+new Date + 12096e5); document.body.innerHTML = newdate; 

which returns the date and time two weeks from now, but like this: Wed Mar 27 2013 21:50:29 GMT+0000 (GMT Standard Time)

Here is the code in jsFiddle.

Any help would be appreciated!

Answer 1

Note this works for day numbers from 1 to 31.

const nth = function(d) {   if (d > 3 && d < 21) return 'th';   switch (d % 10) {     case 1:  return "st";     case 2:  return "nd";     case 3:  return "rd";     default: return "th";   } }  // test code  const fortnightAway = new Date(+new Date + 12096e5); const date = fortnightAway.getDate(); const month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"][fortnightAway.getMonth()];  document.getElementById("date").innerHTML = `In two weeks it will be the ${date}<sup>${nth(date)}</sup> of ${month} ${fortnightAway.getFullYear()}`;  // test const dates = [...Array(32).keys()].slice(1).map(i => `${i}${nth(i)}`) console.log(dates.join(", "))

sup {   font-size: x-small }

<span id="date"></span>

Here is a version for any number

const nth = function(d) {   const dString = String(d);   const last = +dString.slice(-2);   if (last > 3 && last < 21) return 'th';   switch (last % 10) {     case 1:  return "st";     case 2:  return "nd";     case 3:  return "rd";     default: return "th";   } }  // test const numbers = [...Array(1225).keys()].map(i => `${i}${nth(i)}`) console.log(numbers.join(", "))

sup {   font-size: x-small }

<span id="date"></span>

Answer 2

Here is a one liner inspired by the other answers. It is tested and will take 0 and negative numbers.

function getOrdinalNum(n) {   return n + (n > 0 ? ['th', 'st', 'nd', 'rd'][(n > 3 && n < 21) || n % 10 > 3 ? 0 : n % 10] : ''); } 

Update 2020-06-23. The following is a better readable answer of the function above:

const getOrdinalNum = (number) => {   let selector;    if (number <= 0) {     selector = 4;   } else if ((number > 3 && number < 21) || number % 10 > 3) {     selector = 0;   } else {     selector = number % 10;   }    return number + ['th', 'st', 'nd', 'rd', ''][selector]; };