70

如果可能的话,没有 JavaScript 库或大量笨拙的代码,我正在寻找最简单的方法来格式化两周后的日期,格式如下:

13th March 2013

我正在使用的代码是:

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

它返回两周后的日期和时间,但如下所示: Wed Mar 27 2013 21:50:29 GMT+0000 (GMT Standard Time)

这是jsFiddle中的代码。

任何帮助,将不胜感激!

4

20 回答 20

124

请注意,这适用于从 1 到 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>

这是任何数字的版本

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>

于 2013-03-13T22:11:51.083 回答
33

这是受其他答案启发的一个班轮。它经过测试,将采用 0 和负数。

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

2020 年 6 月 23 日更新。以下是上述函数的可读性更好的答案:

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];
};


于 2017-06-07T17:00:48.693 回答
8

我也在为日期执行此操作,但是因为一个月中的日期只能在 1 到 31 之间,所以我最终得到了一个简化的解决方案。

function dateOrdinal(dom) {
    if (dom == 31 || dom == 21 || dom == 1) return dom + "st";
    else if (dom == 22 || dom == 2) return dom + "nd";
    else if (dom == 23 || dom == 3) return dom + "rd";
    else return dom + "th";
};

或使用条件运算符的紧凑版本

function dateOrdinal(d) {
    return d+(31==d||21==d||1==d?"st":22==d||2==d?"nd":23==d||3==d?"rd":"th")
};

http://jsben.ch/#/DrBpl

于 2017-02-15T22:57:50.760 回答
4

很多格式的答案,所以我将只处理任何整数的第 n 个 -

Number.prototype.nth= function(){
    if(this%1) return this;
    var s= this%100;
    if(s>3 && s<21) return this+'th';
    switch(s%10){
        case 1: return this+'st';
        case 2: return this+'nd';
        case 3: return this+'rd';
        default: return this+'th';
    }
}
于 2013-03-13T22:14:37.743 回答
4

这是一个适用于任何数字的简单函数:

function getOrdinal(n) {
    let ord = ["st", "nd", "rd"]
    let exceptions = [11, 12, 13]
    let nth = 
    ord[(n % 10) - 1] == undefined || exceptions.includes(n % 100) ? "th" : ord[(n % 10) - 1]
    return n + nth
}

它可以接受数字或数字作为字符串。例如:

getOrdinal(28)        //Outputs: 28th
getOrdinal('108')     //Outputs: 108th
于 2021-01-20T08:02:28.897 回答
3

如果您是 moment.js 的粉丝,那么您可以使用 format("Do")

例子

var newdate = new Date();
moment(newdate).format("Do MMMM YYYY")
//Returns 1st January 2020

moment("01/01/2020", "MM/DD/YYYY").format("Do")
//Returns 1st

moment("01/01/2020", "MM/DD/YYYY").format("Do MMM YYYY")
//Returns 1st Jan 2020
于 2020-04-21T12:17:17.220 回答
2

很多答案,还有一个:

function addOrd(n) {
  var ords = [, 'st', 'nd', 'rd'];
  var ord, m = n % 100;
  return n + ((m > 10 && m < 14) ? 'th' : ords[m % 10] || 'th');
}

// Return date string two weeks from now (14 days) in 
// format 13th March 2013
function formatDatePlusTwoWeeks(d) {
  var months = ['January', 'February', 'March', 'April', 'May', 'June',
    'July', 'August', 'September', 'October', 'November', 'December'
  ];

  // Copy date object so don't modify original
  var e = new Date(d);

  // Add two weeks (14 days)
  e.setDate(e.getDate() + 14);
  return addOrd(e.getDate()) + ' ' + months[e.getMonth()] + ' ' + e.getFullYear();
}

console.log(formatDatePlusTwoWeeks(new Date()));

// Alternative using Intl.DateTimeFormat
function datePlusTwoWeeks(date = new Date()) {
  let d = new Date(date.getFullYear(), date.getMonth(), date.getDate() + 14);
  let parts = new Intl.DateTimeFormat('en',{
    year: 'numeric',
    month: 'long',
    day: 'numeric'
  }).formatToParts(d).reduce((acc, part) => {
    acc[part.type] = part.value;
    return acc;
  }, Object.create(null));
  return `${addOrd(parts.day)} ${parts.month} ${parts.year}`;
}

console.log(datePlusTwoWeeks())

于 2013-03-13T22:28:22.240 回答
2

解决方案海洋中的另一种解决方案。

let suffix = (day >= 4 &&  day <= 20) || (day >= 24 && day <= 30)
    ? "th"
    : ["st", "nd", "rd"][day % 10 - 1];
于 2020-06-22T08:51:54.450 回答
1

我参加聚会有点晚了,但这应该可行:

function ordinal(number) {
  number = Number(number)
  if(!number || (Math.round(number) !== number)) {
    return number
  }
  var signal = (number < 20) ? number : Number(('' + number).slice(-1))
  switch(signal) {
    case 1:
      return number + 'st'
    case 2:
      return number + 'nd'
    case 3:
      return number + 'rd'
    default:
      return number + 'th'
  }
}

function specialFormat(date) {
  // add two weeks
  date = new Date(+date + 12096e5)
  var months = [
    'January'
    , 'February'
    , 'March'
    , 'April'
    , 'May'
    , 'June'
    , 'July'
    , 'August'
    , 'September'
    , 'October'
    , 'November'
    , 'December'
  ]
  var formatted = ordinal(date.getDate())
  formatted += ' ' + months[date.getMonth()]
  return formatted + ' ' + date.getFullYear()
}

document.body.innerHTML = specialFormat(new Date())
于 2013-08-08T18:15:14.887 回答
1

这里已经有很多很好的答案,尽管使用Intl.PluralRules(标准化跨语言环境的序数分类)的答案可能仍然有用。

以下是en-GB.

jsfiddle

  • 一个班轮:

    console.log({one:'st',two:'nd',few:'rd',other:'th'}[new Intl.PluralRules('en-GB', { type: 'ordinal' }).select(new Date().getDate())])
    
  • 一个详细的例子:

    const suffixMap = {
      one: 'st',
      two: 'nd',
      few: 'rd',
      other: 'th',
    };
    const locale = 'en-GB';
    const moment = new Date();
    const dayOfMonth = moment.getDate();
    const pluralRuleOptions = {
      type: 'ordinal',
    };
    const pluralRule = new Intl.PluralRules(locale, pluralRuleOptions);
    const ordinal = pluralRule.select(dayOfMonth);
    console.log(suffixMap[ordinal])
    

const suffix = {
  one: 'st',
  two: 'nd',
  few: 'rd',
  other: 'th',
};

document.getElementById("tomorrow-month").innerHTML = new Intl.DateTimeFormat('en-GB', { month: 'long' }).format(new Date(Date.now() + 86400000));
document.getElementById("tomorrow-day").innerHTML = new Intl.DateTimeFormat('en-GB', { day: 'numeric' }).format(new Date(Date.now() + 86400000));
document.getElementById("tomorrow-ordinal").innerHTML = suffix[new Intl.PluralRules('en-GB', { type: 'ordinal' }).select(new Date(Date.now() + 86400000).getDate())];

document.getElementById("yesterday-month").innerHTML = new Intl.DateTimeFormat('en-GB', { month: 'long' }).format(new Date(Date.now() - 86400000));
document.getElementById("yesterday-day").innerHTML = new Intl.DateTimeFormat('en-GB', { day: 'numeric' }).format(new Date(Date.now() - 86400000));
document.getElementById("yesterday-ordinal").innerHTML = suffix[new Intl.PluralRules('en-GB', { type: 'ordinal' }).select(new Date(Date.now() - 86400000).getDate())];
Tomorrow, on <span id="tomorrow-month"></span> <span id="tomorrow-day"></span><sup id="tomorrow-ordinal"></sup>, I ordered a time machine.
It arrived yesterday on <span id="yesterday-month"></span> <span id="yesterday-day"></span><sup id="yesterday-ordinal"></sup>.

于 2021-10-23T11:00:33.163 回答
1

这对我很有用

ordinal(n) {
    var s = ["th", "st", "nd", "rd"];
    var v = n%100;
    return n + (s[(v-20)%10] || s[v] || s[0]);
}

用法:

console.log(ordinal(11))
OUTPUT: 11th
于 2021-10-20T13:43:28.187 回答
0

没有 JavaScript 库或大量笨拙的代码

实现这一点的一种简单方法是在 vanilla javascript 中使用一系列三个三元语句来确定序数,如下所示:

let dateOrdinal = 'th';

dateOrdinal = ([1, 21, 31].indexOf(dateNumber) > -1) ? 'st' : dateOrdinal;
dateOrdinal = ([2, 22].indexOf(dateNumber) > -1) ? 'nd' : dateOrdinal;
dateOrdinal = ([3, 23].indexOf(dateNumber) > -1) ? 'rd' : dateOrdinal;

它不像人类可读的那样,但您可以使用switch/case语句来做出相同的决定:

switch (true) {
  
  case ([1, 21, 31].indexOf(dateNumber) > -1) : let dateOrdinal = 'st'; break;
  case ([2, 22].indexOf(dateNumber) > -1) : let dateOrdinal = 'nd'; break;
  case ([3, 23].indexOf(dateNumber) > -1) : let dateOrdinal = 'rd'; break;
  default : let dateOrdinal = 'th';
}

工作示例:

// GET DATE PARTS
const dateInTwoWeeks = new Date(+new Date + 12096e5);
const dateNumber = dateInTwoWeeks.getDate();
const dateMonth = dateInTwoWeeks.toLocaleString('default', {month: 'long'});
const dateYear = dateInTwoWeeks.getFullYear();

// DETERMINE DATE ORDINAL
let dateOrdinal = 'th';

dateOrdinal = ([1, 21, 31].indexOf(dateNumber) > -1) ? 'st' : dateOrdinal;
dateOrdinal = ([2, 22].indexOf(dateNumber) > -1) ? 'nd' : dateOrdinal;
dateOrdinal = ([3, 23].indexOf(dateNumber) > -1) ? 'rd' : dateOrdinal;

// FORMAT DATE AS STRING
const dateInTwoWeeksString = `${dateNumber}${dateOrdinal} ${dateMonth} ${dateYear}`; 

document.body.textContent = dateInTwoWeeksString;

于 2021-12-14T00:29:07.247 回答
0

	Date.prototype.getMonthName = function(shorten) {
		var monthsNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
		var monthIndex = this.getMonth();
		var tempIndex = -1;
	    if (monthIndex == 0){ tempIndex = 0 };
	    if (monthIndex == 1){ tempIndex = 1 };
	    if (monthIndex == 2){ tempIndex = 2 };
	    if (monthIndex == 3){ tempIndex = 3 };
	    if (monthIndex == 4){ tempIndex = 4 };
	    if (monthIndex == 5){ tempIndex = 5 };
	    if (monthIndex == 6){ tempIndex = 6 };
	    if (monthIndex == 7){ tempIndex = 7 };
	    if (monthIndex == 8){ tempIndex = 8 };
	    if (monthIndex == 9){ tempIndex = 9 };
	    if (monthIndex == 10){ tempIndex = 10 };
	    if (monthIndex == 11){ tempIndex = 11 };

	    if (tempIndex > -1) {
			this.monthName = (shorten) ? monthsNames[tempIndex].substring(0, 3) : monthsNames[tempIndex];
	    } else {
	    	this.monthName = "";
	    }

	    return this.monthName;
	};

    Date.prototype.getDateWithDateOrdinal = function() {
		var d = this.getDate();  // from here on I've used Kennebec's answer, but improved it.
	    if(d>3 && d<21) return d+'th';
	    switch (d % 10) {
            case 1:  return d+"st";
            case 2:  return d+"nd";
            case 3:  return d+"rd";
            default: return d+"th";
        }
	};

	var myDate = new Date();
    // You may have to check your JS Console in the web browser to see the following
	console.log("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());
    
    // or I will update the Div. using jQuery
    $('#date').html("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="date"></p>

于 2018-04-14T19:12:39.193 回答
0

正如许多人提到的,这是另一个答案。

这直接基于@kennebec的回答,我找到了最简单的方法来获取为给定日期生成的OrdinalJavaScript日期:

我创建了两个prototype function如下:

Date.prototype.getDateWithDateOrdinal = function() {
    var d = this.getDate();  // from here on I've used Kennebec's answer, but improved it.
    if(d>3 && d<21) return d+'th';
    switch (d % 10) {
        case 1:  return d+"st";
        case 2:  return d+"nd";
        case 3:  return d+"rd";
        default: return d+"th";
    }
};

Date.prototype.getMonthName = function(shorten) {
    var monthsNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var monthIndex = this.getMonth();
    var tempIndex = -1;
    if (monthIndex == 0){ tempIndex = 0 };
    if (monthIndex == 1){ tempIndex = 1 };
    if (monthIndex == 2){ tempIndex = 2 };
    if (monthIndex == 3){ tempIndex = 3 };
    if (monthIndex == 4){ tempIndex = 4 };
    if (monthIndex == 5){ tempIndex = 5 };
    if (monthIndex == 6){ tempIndex = 6 };
    if (monthIndex == 7){ tempIndex = 7 };
    if (monthIndex == 8){ tempIndex = 8 };
    if (monthIndex == 9){ tempIndex = 9 };
    if (monthIndex == 10){ tempIndex = 10 };
    if (monthIndex == 11){ tempIndex = 11 };

    if (tempIndex > -1) {
        this.monthName = (shorten) ? monthsNames[tempIndex].substring(0, 3) : monthsNames[tempIndex];
    } else {
        this.monthName = "";
    }

    return this.monthName;
};

注意:只需将上述prototype功能包含在您的内部JS Script并按照如下所述使用它。

每当有JS 日期时,我需要使用日期序号生成日期,我在该日期使用该原型方法,如下所示JS

var myDate = new Date();
// You may have to check your JS Console in the web browser to see the following
console.log("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());

// or I will update the Div. using jQuery
$('#date').html("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());

它会打印出带有日期序号的日期,如以下现场演示所示:

	Date.prototype.getMonthName = function(shorten) {
		var monthsNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
		var monthIndex = this.getMonth();
		var tempIndex = -1;
	    if (monthIndex == 0){ tempIndex = 0 };
	    if (monthIndex == 1){ tempIndex = 1 };
	    if (monthIndex == 2){ tempIndex = 2 };
	    if (monthIndex == 3){ tempIndex = 3 };
	    if (monthIndex == 4){ tempIndex = 4 };
	    if (monthIndex == 5){ tempIndex = 5 };
	    if (monthIndex == 6){ tempIndex = 6 };
	    if (monthIndex == 7){ tempIndex = 7 };
	    if (monthIndex == 8){ tempIndex = 8 };
	    if (monthIndex == 9){ tempIndex = 9 };
	    if (monthIndex == 10){ tempIndex = 10 };
	    if (monthIndex == 11){ tempIndex = 11 };

	    if (tempIndex > -1) {
			this.monthName = (shorten) ? monthsNames[tempIndex].substring(0, 3) : monthsNames[tempIndex];
	    } else {
	    	this.monthName = "";
	    }

	    return this.monthName;
	};

    Date.prototype.getDateWithDateOrdinal = function() {
		var d = this.getDate();  // from here on I've used Kennebec's answer, but improved it.
	    if(d>3 && d<21) return d+'th';
	    switch (d % 10) {
            case 1:  return d+"st";
            case 2:  return d+"nd";
            case 3:  return d+"rd";
            default: return d+"th";
        }
	};

	var myDate = new Date();
    // You may have to check your JS Console in the web browser to see the following
	console.log("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());
    
    // or I will update the Div. using jQuery
    $('#date').html("date with date ordinal: "+myDate.getDateWithDateOrdinal()+" "+myDate.getMonthName()+" "+myDate.getFullYear());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="date"></p>

.

于 2015-10-14T19:49:46.337 回答
0
function getSuffixForDate(day) {
  const lastNumberOfTheDay = day[day.length];

  const suffixes = {
    1: () => 'st',
    21: () => 'st',
    31: () => 'st',
    2: () => 'nd',
    22: () => 'nd',
    3: () => 'rd',
    23: () => 'rd',
  };

  return suffixes[lastNumberOfTheDay] !== undefined ? `${day}${suffixes[lastNumberOfTheDay]()}` : `${day}th`;
}

const date = new Date();
const formattedDate = `${getSuffixForDate(date.getDate())} ${monthNames[date.getMonth()]} ${date.getFullYear()}`;

人类可读的版本...

于 2019-06-28T08:56:42.243 回答
0

一个简短而紧凑的解决方案:

function format(date, tmp){
  return [
    (tmp = date.getDate()) + 
      ([, 'st', 'nd', 'rd'][/1?.$/.exec(tmp)] || 'th'),
    [ 'January', 'February', 'March', 'April',
      'May', 'June', 'July', 'August',
      'September', 'October', 'November', 'December'
    ][date.getMonth()],
    date.getFullYear()
  ].join(' ')
}


// 14 days from today

console.log('14 days from today: ' + 
  format(new Date(+new Date + 14 * 864e5)));

// test formatting for all dates within a month from today

var day = 864e5, today = +new Date;
for(var i = 0; i < 32; i++) {
  console.log('Today + ' + i + ': ' + format(new Date(today + i * day)))
}

(用于获取序数后缀的紧凑型基于正则表达式的方法出现在网络上的 多个 地方,原始来源未知)

于 2017-05-14T19:33:11.043 回答
0

这是一个可读的 ES+ 版本。

const getDateSuffix = (date) => {
  const thExpections = date => [11, 12, 13].some(exception => exception === date);
  const lastDigit = date % 10;

  if (thExpections(date) || lastDigit === 0 || lastDigit > 3) return `${date}th`;
  if (lastDigit === 1) return `${date}st`;
  if (lastDigit === 2) return `${date}nd`;
  return `${date}rd`;
};

const monthNames = [
  "January",
  "February",
  "March",
  "April",
  "May",
  "June",
  "July",
  "August",
  "September",
  "October",
  "November",
  "December",
];

const twoWeeksFromNow = new Date(+new Date + 12096e5);
console.log(`Two weeks from now: ${getDateSuffix(twoWeeksFromNow.getDate())} ${monthNames[twoWeeksFromNow.getMonth()]} ${twoWeeksFromNow.getFullYear()}`)

console.log(`
=================
Test date suffixes:`);
const logOutDates = new Array(31).fill(0).forEach((_, index) => console.log(getDateSuffix(index + 1)))

于 2021-03-14T13:08:18.603 回答
-1

受到@user2309185的强烈启发。

const ordinal = (d) => {
  return d + (['st', 'nd', 'rd'][d % 10 - 1] || 'th')
}
于 2017-01-26T11:26:03.220 回答
-1

超级简单的功能实现:

const ordinal = (d) => {
  const nth = { '1': 'st', '2': 'nd', '3': 'rd' }
  return `${d}${nth[d] || 'th'}`
}

const monthNames = ['January','February','March','April','May','June','July','August','September','October','November','December']

const dateString = (date) => `${ordinal(date.getDate())} ${monthNames[date.getMonth()]} ${date.getFullYear()}`

// Use like this: 
dateString(new Date()) // 18th July 2016
于 2016-07-19T03:50:08.153 回答
-1

这是一个简单的解决方案:

var date = today.getDate() + (today.getDate() % 10 == 1 && today.getDate() != 11 ? + 'st': (today.getDate() % 10 == 2 && today.getDate() != 12 ? + 'nd': 

(today.getDate() % 10 == 3 && today.getDate() != 13 ? + 'rd':'th')));
于 2018-01-07T06:00:02.183 回答