web-dev-qa-db-ja.com

st、nd、rd、およびth(序数)のサフィックスを数値に追加します

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

合計で12日あるため、次のことを行いました。

  1. 12日間をループするforループを設定しました。

  2. 私のhtmlでは、要素をターゲットとする一意のIDを指定しています。以下を参照してください。

    <h1 id="dynamicTitle" class="CustomFont leftHeading shadow">On The <span></span> <em>of rest of generic text</em></h1>
    
  3. 次に、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"
    }
    

UPDATE

これは、要求された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) {
            }
        }
    }
114
Antonio Vasilev

rules は次のとおりです。

  • stは、1で終わる数字で使用されます(例:1st、最初に発音)
  • ndは2で終わる数字で使用されます(例:92nd、90秒と発音)
  • rdは、末尾が3の数字で使用されます(例:33rd、33番目と発音)
  • 上記の規則の例外として、11、12、または13で終わるすべての「ティーン」番号は-thを使用します(例:11番目、11番目、112番目、100番目(12番目)と発音)
  • thは、他のすべての数値に使用されます(例:9番目、9番目と発音)。

次のJavaScriptコード(14年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の数値のサンプル出力:

  0  0th
  1  1st
  2  2nd
  3  3rd
  4  4th
  5  5th
  6  6th
  7  7th
  8  8th
  9  9th
 10  10th
 11  11th
 12  12th
 13  13th
 14  14th
 15  15th
 16  16th
 17  17th
 18  18th
 19  19th
 20  20th
 21  21st
 22  22nd
 23  23rd
 24  24th
 25  25th
 26  26th
 27  27th
 28  28th
 29  29th
 30  30th
 31  31st
 32  32nd
 33  33rd
 34  34th
 35  35th
 36  36th
 37  37th
 38  38th
 39  39th
 40  40th
 41  41st
 42  42nd
 43  43rd
 44  44th
 45  45th
 46  46th
 47  47th
 48  48th
 49  49th
 50  50th
 51  51st
 52  52nd
 53  53rd
 54  54th
 55  55th
 56  56th
 57  57th
 58  58th
 59  59th
 60  60th
 61  61st
 62  62nd
 63  63rd
 64  64th
 65  65th
 66  66th
 67  67th
 68  68th
 69  69th
 70  70th
 71  71st
 72  72nd
 73  73rd
 74  74th
 75  75th
 76  76th
 77  77th
 78  78th
 79  79th
 80  80th
 81  81st
 82  82nd
 83  83rd
 84  84th
 85  85th
 86  86th
 87  87th
 88  88th
 89  89th
 90  90th
 91  91st
 92  92nd
 93  93rd
 94  94th
 95  95th
 96  96th
 97  97th
 98  98th
 99  99th
100  100th
101  101st
102  102nd
103  103rd
104  104th
105  105th
106  106th
107  107th
108  108th
109  109th
110  110th
111  111th
112  112th
113  113th
114  114th
115  115th
296
Salman A

From Shopify

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

順序接尾辞の最小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では偽であり、論理的または(|| "th")を使用すると、式はこれらの整数に対して"th"を返します。これはまさに私たちが望むものです。

((n + 90) % 100 - 10) % 10 - 1がマッピングを行います。分解する:

  • (n + 90) % 100:この式は、10から0、... 99から89、0から90、...、9から99にマッピングされた入力整数-10 mod 100を取ります。11、12で終わる整数13は下端にあります(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"}

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'

説明については この投稿 をご覧ください。

34
Tomas Langkaas

数値を配列に分割して逆にすることにより、array[0]array[1]を使用して、数値の最後の2桁を簡単に確認できます。

数値が10代のarray[1] = 1の場合、「th」が必要です。

function getDaySuffix(num)
{
    var array = ("" + num).split("").reverse(); // E.g. 123 = array("3","2","1")

    if (array[1] != "1") { // Number is in the teens
        switch (array[0]) {
            case "1": return "st";
            case "2": return "nd";
            case "3": return "rd";
        }
    }

    return "th";
}
7
nick

まだ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'
7
Jamiec
function getSuffix(n) {return n < 11 || n > 13 ? ['st', 'nd', 'rd', 'th'][Math.min((n - 1) % 10, 3)] : 'th'}
5
Johnny

順序関数の代替バージョンは次のとおりです。

function toCardinal(num) {
    var ones = num % 10;
    var tens = num % 100;

    if (tens < 11 || tens > 13) {
        switch (ones) {
            case 1:
                return num + "st";
            case 2:
                return num + "nd";
            case 3:
                return num + "rd";
        }
    }

    return num + "th";
}

変数はより明示的に名前が付けられ、キャメルケースの規則が使用され、より高速になる場合があります。

2
Daniel Harvey

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

// 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
2
Jimmery

function ordsfx(a){return["th","st","nd","rd"][(a=~~(a<0?-a:a)%100)>10&&a<14||(a%=10)>3?0:a]}

注釈付きバージョンを参照してください https://Gist.github.com/furf/986113#file-annotated-js

ユーティリティ関数がそうであるように、短く、甘く、効率的です。符号付き/符号なし整数/浮動小数点で動作します。 (フロートを順序付けする必要があるとは想像できませんが)

1
Raine

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

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;
};
1
Sir Kettle

この関数は、より高い数値とすべてのテストケース用に作成しました

function numberToOrdinal(num) {
    if (num === 0) {
        return '0'
    };
    let i = num.toString(), j = i.slice(i.length - 2), k = i.slice(i.length - 1);
    if (j >= 10 && j <= 20) {
        return (i + 'th')
    } else if (j > 20 && j < 100) {
        if (k == 1) {
            return (i + 'st')
        } else if (k == 2) {
            return (i + 'nd')
        } else if (k == 3) {
            return (i + 'rd')
        } else {
            return (i + 'th')
        }
    } else if (j == 1) {
        return (i + 'st')
    } else if (j == 2) {
        return (i + 'nd')
    } else if (j == 3) {
        return (i + 'rd')
    } else {
        return (i + 'th')
    }
}
0
Amaechi chuks

別のオプションがあります。

function getOrdinalSuffix(day) {
        
        if(/^[2-3]?1$/.test(day)){
                return 'st';
        } else if(/^[2-3]?2$/.test(day)){
                return 'nd';
        } else if(/^[2-3]?3$/.test(day)){
                return 'rd';
        } else {
                return 'th';
        }
        
}
    
console.log(getOrdinalSuffix('1'));
console.log(getOrdinalSuffix('13'));
console.log(getOrdinalSuffix('22'));
console.log(getOrdinalSuffix('33'));

10代の例外に注意してください。十代の若者たちはとても気難しいです!

編集:11日と12日を忘れました

0
Bullyen

Intl.PluralRulesstandardメソッド。

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

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(100)
        .fill()
        .map((_, index) => index)
        .map(ordinal)
        .join(" ");
console.log(test);

これを強くお勧めします。非常に簡単で読みやすいです。役立つと思いますか?

  • 負の整数、つまり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
0
An'Apluss

既存の回答を補完するために、この質問に機能的な回答を提供したかったのです。

const ordinalSuffix = ['st', 'nd', 'rd']
const addSuffix = n => n + (ordinalSuffix[(n - 1) % 10] || 'th')
const numberToOrdinal = n => `${n}`.match(/1\d$/) ? n + 'th' : addSuffix(n)

特別な値の配列を作成しました。覚えておくべき重要なことは、配列にゼロベースのインデックスがあるため、ordinalSuffix [0]が 'st'に等しいことです。

関数numberToOrdinalは、数字が10進数で終わるかどうかをチェックします。この場合、数字の序数はすべて「th」なので、数字に「th」を追加します。数値が10代ではない場合、addSuffixに数値を渡します。この数値は、数値から1を引いた値(ゼロベースのインデックスを使用しているため)mod 10の剰余が2である場合に決定されます以下の場合、配列から取得されます。それ以外の場合は「th」です。

サンプル出力:

numberToOrdinal(1) // 1st
numberToOrdinal(2) // 2nd
numberToOrdinal(3) // 3rd
numberToOrdinal(4) // 4th
numberToOrdinal(5) // 5th
numberToOrdinal(6) // 6th
numberToOrdinal(7) // 7th
numberToOrdinal(8) // 8th
numberToOrdinal(9) // 9th
numberToOrdinal(10) // 10th
numberToOrdinal(11) // 11th
numberToOrdinal(12) // 12th
numberToOrdinal(13) // 13th
numberToOrdinal(14) // 14th
numberToOrdinal(101) // 101st
0
Peter McArthur

優れた date-fns ライブラリを強くお勧めします。高速、モジュール式、不変、標準日付で動作します。

import * as DateFns from 'date-fns';

const ordinalInt = DateFns.format(someInt, 'do');

Date-fnsのドキュメントを参照してください: https://date-fns.org/v2.0.0-alpha.9/docs/format

0
Luke Williams

私は自分のもののために作った古いもの...

function convertToOrdinal(number){
    if (number !=1){
        var numberastext = number.ToString();
        var endchar = numberastext.Substring(numberastext.Length - 1);
        if (number>9){
            var secondfromendchar = numberastext.Substring(numberastext.Length - 1);
            secondfromendchar = numberastext.Remove(numberastext.Length - 1);
        }
        var suffix = "th";
        var digit = int.Parse(endchar);
        switch (digit){
            case 3:
                if(secondfromendchar != "1"){
                    suffix = "rd";
                    break;
                }
            case 2:
                if(secondfromendchar != "1"){
                    suffix = "nd";
                    break;
                }
            case 1:
                if(secondfromendchar != "1"){
                    suffix = "st";
                    break;
                }
            default:
                suffix = "th";
                break;
         }
            return number+suffix+" ";
     } else {
            return;
     }
}
0
user10304