javascript - st、nd、rd、および th (序数) 接尾辞を数値に追加します

Question

現在の日付に基づいてテキストの文字列を動的に生成したいと思います。したがって、たとえば、1 日目の場合、コードで = "Its the <dynamic>1*<dynamic string> st </dynamic string>*</dynamic>" を生成する必要があります。

全部で 12 日間あるので、次のことを行いました。

12 日間ループする for ループを設定しました。
私のhtmlでは、要素をターゲットにするための一意のIDを要素に与えました。以下を参照してください。
```
<h1 id="dynamicTitle" class="CustomFont leftHeading shadow">On The of rest of generic text</h1>
```

次に、 for ループ内に次のコードがあります。

$("#dynamicTitle span").html(i);
var day = i;
if (day == 1) {
    day = i + "st";
} else if (day == 2) {
    day = i + "nd"
} else if (day == 3) {
    day = i + "rd"
}

アップデート

これは、要求された for ループ全体です。

$(document).ready(function () {
    for (i = 1; i <= 12; i++) {
        var classy = "";
        if (daysTilDate(i + 19) > 0) {
            classy = "future";
            $("#Day" + i).addClass(classy);
            $("#mainHeading").html("");
            $("#title").html("");
            $("#description").html("");
        } else if (daysTilDate(i + 19) < 0) {
            classy = "past";
            $("#Day" + i).addClass(classy);
            $("#title").html("");
            $("#description").html("");
            $("#mainHeading").html("");
            $(".cta").css('display', 'none');
            $("#Day" + i + " .prizeLink").attr("href", "" + i + ".html");
        } else {
            classy = "current";
            $("#Day" + i).addClass(classy);
            $("#title").html(headings[i - 1]);
            $("#description").html(descriptions[i - 1]);
            $(".cta").css('display', 'block');
            $("#dynamicImage").attr("src", ".." + i + ".jpg");
            $("#mainHeading").html("");
            $(".claimPrize").attr("href", "" + i + ".html");
            $("#dynamicTitle span").html(i);
            var day = i;
            if (day == 1) {
                day = i + "st";
            } else if (day == 2) {
                day = i + "nd"
            } else if (day == 3) {
                day = i + "rd"
            } else if (day) {
            }
        }
    }

score 451 · Accepted Answer

ルールは次のとおりです。

st は 1 で終わる数字で使用されます (例: 1st、最初に発音)

nd は 2 で終わる数字で使用されます (例: 92nd、92 と発音)

rd は 3 で終わる数字で使用されます (例: 33rd、33 と発音)

上記のルールの例外として、11、12、または 13 で終わるすべての「10 代」の数字は -th を使用します (たとえば、11th は 11th と発音し、112th は 100 と発音し、12th と発音します)。

th は他のすべての数字に使用されます (例: 9th、発音は 9th)。

次の JavaScript コード (2014 年 6 月に書き直されたもの) はこれを実現します。

function ordinal_suffix_of(i) {
    var j = i % 10,
        k = i % 100;
    if (j == 1 && k != 11) {
        return i + "st";
    }
    if (j == 2 && k != 12) {
        return i + "nd";
    }
    if (j == 3 && k != 13) {
        return i + "rd";
    }
    return i + "th";
}

0 ～ 115 の数値の出力例:

score 236 · Accepted Answer

Shopifyから

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

[-4,-1,0,1,2,3,4,10,11,12,13,14,20,21,22,100,101,111].forEach(
  n => console.log(n + ' -> ' + getNumberWithOrdinal(n))
);

score 87 · Accepted Answer

序数接尾辞の最小限の 1 行アプローチ

function nth(n){return["st","nd","rd"][((n+90)%100-10)%10-1]||"th"}

(これは正の整数用です。他のバリエーションについては以下を参照してください)

説明

接尾辞の配列から始めます["st", "nd", "rd"]。1、2、3 で終わる (11、12、13 で終わらない) 整数をインデックス 0、1、2 にマップします。

他の整数 (11、12、13 で終わるものを含む) は、他のものにマップできます。配列内に見つからないインデックスは、に評価されundefinedます。これは javascript では誤りであり、論理 or ( || "th") を使用すると、これらの整数に対して式が返さ"th"れます。これはまさに私たちが望んでいるものです。

式((n + 90) % 100 - 10) % 10 - 1はマッピングを行います。それを分解する：

(n + 90) % 100: この式は、入力整数 - 10 mod 100 を取り、10 を 0、... 99 を 89、0 を 90、...、9 を 99 にマッピングします。11、12、13 で終わる整数は下位にあります。 end (1、2、3 にマップされます)。
- 10: 10 は −10、19 は −1、99 は 79、0 は 80、... 9 は 89 にマッピングされます。11、12、13 で終わる整数は負の整数 (−9、−8、 −7)。
% 10: 1、2、または 3 で終わるすべての整数は、1、2、3 にマップされます。他のすべての整数は別のものにマップされます (11、12、13 は、-9、-8、-7 に引き続きマップされます)。
- 1: 1 を引くと、1、2、3 から 0、1、2 への最終的なマッピングが得られます。

動作確認中

function nth(n){return["st","nd","rd"][((n+90)%100-10)%10-1]||"th"}

//test integers from 1 to 124
for(var r = [], i = 1; i < 125; i++) r.push(i + nth(i));

//output result
document.getElementById('result').innerHTML = r.join('<br>');

<div id="result"></div>

バリエーション

負の整数を許可:

function nth(n){return["st","nd","rd"][(((n<0?-n:n)+90)%100-10)%10-1]||"th"}

function nth(n){return["st","nd","rd"][(((n<0?-n:n)+90)%100-10)%10-1]||"th"}

//test integers from 15 to -124
for(var r = [], i = 15; i > -125; i--) r.push(i + nth(i));

//output result
document.getElementById('result').innerHTML = r.join('<br>');

<div id="result"></div>

ES6 の太い矢印の構文 (無名関数) では:

n=>["st","nd","rd"][(((n<0?-n:n)+90)%100-10)%10-1]||"th"

アップデート

正の整数のさらに短い代替は、次の式です。

[,'st','nd','rd'][n%100>>3^1&&n%10]||'th'

説明については、この投稿を参照してください。

更新 2

[,'st','nd','rd'][n/10%10^1&&n%10]||'th'

score 48 · Accepted Answer

`Intl.PluralRules`、標準的な方法。

誰も知らないように見えるので、ここでこれを行う標準的な方法を落としたいと思います。

コードを

自己記録
ローカライズしやすい
現代の基準で

―これが道だ。

const english_ordinal_rules = new Intl.PluralRules("en", {type: "ordinal"});
const suffixes = {
    one: "st",
    two: "nd",
    few: "rd",
    other: "th"
};
function ordinal(number) {
    const suffix = suffixes[english_ordinal_rules.select(number)];
    return (number + suffix);
}

const test = Array(201)
    .fill()
    .map((_, index) => index - 100)
    .map(ordinal)
    .join(" ");
console.log(test);

score 7 · Accepted Answer

12日しかないの？単純なルックアップ配列にしたくなるでしょう：

var suffixes = ['','st','nd','rd','th','th','th','th','th','th','th','th','th'];

それから

var i = 2;
var day = i + suffixes[i]; // result: '2nd'

また

var i = 8;
var day = i + suffixes[i]; // result: '8th'

score 4 · Accepted Answer

function getSuffix(n) {return n < 11 || n > 13 ? ['st', 'nd', 'rd', 'th'][Math.min((n - 1) % 10, 3)] : 'th'}

score 3 · Accepted Answer

この問題を解決するためにこの関数を書きました：

// this is for adding the ordinal suffix, turning 1, 2 and 3 into 1st, 2nd and 3rd
Number.prototype.addSuffix=function(){
    var n=this.toString().split('.')[0];
    var lastDigits=n.substring(n.length-2);
    //add exception just for 11, 12 and 13
    if(lastDigits==='11' || lastDigits==='12' || lastDigits==='13'){
        return this+'th';
    }
    switch(n.substring(n.length-1)){
        case '1': return this+'st';
        case '2': return this+'nd';
        case '3': return this+'rd';
        default : return this+'th';
    }
};

これを使用すると、任意の数に入れるだけ.addSuffix()で、必要な結果が得られます。例えば：

var number=1234;
console.log(number.addSuffix());
// console will show: 1234th

score 1 · Accepted Answer

先日、この単純な関数を書きました。日付には大きな数字は必要ありませんが、これはより高い値にも対応します (1013th、36021st など...)。

var fGetSuffix = function(nPos){

    var sSuffix = "";

    switch (nPos % 10){
        case 1:
            sSuffix = (nPos % 100 === 11) ? "th" : "st";
            break;
        case 2:
            sSuffix = (nPos % 100 === 12) ? "th" : "nd";
            break;
        case 3:
            sSuffix = (nPos % 100 === 13) ? "th" : "rd";
            break;
        default:
            sSuffix = "th";
            break;
    }

    return sSuffix;
};

score -1 · Accepted Answer

とても読みやすくてわかりやすいのでオススメです。それが役立つことを願っていますか？

負の整数、つまり 1 未満の数値の使用を避け、false を返します。
入力が 0 の場合は 0 を返します

function numberToOrdinal(n) {

  let result;

  if(n < 0){
    return false;
  }else if(n === 0){
    result = "0";
  }else if(n > 0){

    let nToString = n.toString();
    let lastStringIndex = nToString.length-1;
    let lastStringElement = nToString[lastStringIndex];

    if( lastStringElement == "1" && n % 100 !== 11 ){
      result = nToString + "st";
    }else if( lastStringElement == "2" && n % 100 !== 12 ){
      result = nToString + "nd";
    }else if( lastStringElement == "3" && n % 100 !== 13 ){
      result = nToString + "rd";
    }else{
      result = nToString + "th";
    }

  }

  return result;
}

console.log(numberToOrdinal(-111));
console.log(numberToOrdinal(0));
console.log(numberToOrdinal(11));
console.log(numberToOrdinal(15));
console.log(numberToOrdinal(21));
console.log(numberToOrdinal(32));
console.log(numberToOrdinal(43));
console.log(numberToOrdinal(70));
console.log(numberToOrdinal(111));
console.log(numberToOrdinal(300));
console.log(numberToOrdinal(101));

出力

false
0
11th
15th
21st
32nd
43rd
70th
111th
300th
101st

score -7 · Accepted Answer

<p>31<sup>st</sup> March 2015</p>

使用できます

1st 2nd 3rd 4th

サフィックスの配置用

javascript - st、nd、rd、および th (序数) 接尾辞を数値に追加します

22 に答える 22

序数接尾辞の最小限の 1 行アプローチ

説明

動作確認中

バリエーション

アップデート

更新 2

Intl.PluralRules、標準的な方法。

Related

Reference

`Intl.PluralRules`、標準的な方法。