Wie man Ordnungszahlen wie 1., 2., 3. formatiert
Verwenden Sie JavaScript, um Ordnungszahlen mit sprachspezifischen Suffixen und Formatierungen anzuzeigen
Einführung
Ordnungszahlen geben Position oder Rang in einer Sequenz an. Im Englischen schreibt man 1st, 2nd, 3rd, 4th, um Platzierungen in einem Rennen oder Elemente in einer Liste zu beschreiben. Diese Suffixe helfen, Ordnungszahlen von regulären Zählzahlen zu unterscheiden.
Verschiedene Sprachen verwenden völlig unterschiedliche Konventionen für Ordnungszahlen. Englisch fügt Suffixe wie st, nd, rd und th hinzu. Französisch verwendet hochgestellte Buchstaben wie 1er und 2e. Deutsch fügt einen Punkt nach der Zahl hinzu, wie 1. und 2. Japanisch stellt den Zahlen das Zeichen 第 voran. Wenn Sie englische Ordnungssuffixe fest codieren, gehen Sie davon aus, dass alle Benutzer der gleichen Konvention folgen.
JavaScript bietet die Intl.PluralRules-API mit einem Ordnungstyp, um diese Unterschiede automatisch zu handhaben. Diese Lektion erklärt, was Ordnungszahlen sind, warum ihre Formatierung in verschiedenen Sprachen variiert und wie man sie für jede Sprache korrekt formatiert.
Was Ordnungszahlen sind
Ordnungszahlen drücken Position, Rang oder Reihenfolge in einer Sequenz aus. Sie beantworten die Frage "welche" anstatt "wie viele". Die Zahlen 1st, 2nd, 3rd beschreiben Positionen in einem Rennen. First, second, third beschreiben Elemente in einer Liste.
Kardinalzahlen drücken Menge oder Anzahl aus. Sie beantworten die Frage "wie viele". Die Zahlen 1, 2, 3 beschreiben Anzahlen von Objekten. One, two, three beschreiben Mengen.
Derselbe numerische Wert dient je nach Kontext beiden Zwecken. Die Zahl 5 ist kardinal in "5 Äpfel", aber ordinal in "5. Platz". Der Unterschied ist wichtig, weil viele Sprachen Ordnungszahlen anders formatieren als Kardinalzahlen.
Im Englischen haben Ordnungszahlen unter 10 einzigartige Wortformen. First, second, third, fourth, fifth sind eigenständige Wörter. Über 10 bildet Englisch Ordnungszahlen durch Hinzufügen von Suffixen. Eleventh, twelfth, twentieth, twenty-first folgen Mustern, erfordern aber Suffixe.
Beim Schreiben von Ordnungszahlen als Ziffern statt Wörtern fügt Englisch die Suffixe st, nd, rd oder th hinzu. Diese Suffixe folgen spezifischen Regeln basierend auf den Endziffern der Zahl.
Warum die Ordinalzahlenformatierung je nach Gebietsschema variiert
Verschiedene Sprachen haben unterschiedliche Systeme zur Darstellung von Ordinalzahlen entwickelt. Diese Konventionen spiegeln Grammatikregeln, Schriftsysteme und kulturelle Praktiken wider, die für jede Sprache einzigartig sind.
Im Englischen verwenden Ordinalzahlen vier verschiedene Suffixe. Zahlen, die auf 1 enden, verwenden st, Zahlen, die auf 2 enden, verwenden nd, Zahlen, die auf 3 enden, verwenden rd, und alle anderen Zahlen verwenden th. Allerdings verwenden Zahlen, die auf 11, 12 oder 13 enden, alle th. Dies ergibt 1st, 2nd, 3rd, 4th, 11th, 12th, 13th, 21st, 22nd, 23rd.
Im Französischen werden für Ordinalzahlen hochgestellte Abkürzungen verwendet. Der erste Eintrag verwendet 1er für maskulin oder 1re für feminin. Alle anderen Ordinalzahlen verwenden ein hochgestelltes e, wie 2e, 3e, 4e. Die Formatierung umfasst hochgestellte Typografie, nicht nur Suffix-Buchstaben.
Im Deutschen verwenden Ordinalzahlen einen Punkt nach der Zahl. Die Notation 1., 2., 3. steht für erste, zweite, dritte. Dieser Punkt signalisiert, dass der Leser beim lauten Lesen mental die entsprechende grammatikalische Endung hinzufügen sollte.
Im Spanischen verwenden Ordinalzahlen geschlechtsspezifische hochgestellte Indikatoren. Maskuline Ordinalzahlen verwenden 1.º, 2.º, 3.º, während feminine Ordinalzahlen 1.ª, 2.ª, 3.ª verwenden. Der Punkt trennt die Zahl vom Indikator.
Im Japanischen wird das Präfix 第 vor die Zahl gesetzt. Erste, zweite, dritte erscheinen als 第一, 第二, 第三. Dieses Präfix ändert die Bedeutung von Kardinal- zu Ordinalzahl.
Wenn Sie Ordinalzahlen-Strings erstellen, indem Sie Zahlen mit hartcodierten Suffixen verketten, zwingen Sie alle Benutzer, englische Konventionen zu interpretieren. Dies macht Ihre Anwendung für Menschen, die andere Formate erwarten, schwieriger zu nutzen.
Verständnis von Intl.PluralRules mit dem Typ ordinal
Die Intl.PluralRules-API bestimmt, zu welcher Pluralkategorie eine Zahl für ein bestimmtes Gebietsschema gehört. Während diese API üblicherweise verwendet wird, um zwischen Singular- und Pluralformen von Wörtern zu wählen, behandelt sie auch Ordinalzahlen.
Der Konstruktor akzeptiert eine Gebietsschema-ID und ein Options-Objekt. Setzen Sie die Option type auf "ordinal", um mit Ordinalzahlen anstelle von Kardinalzahlen zu arbeiten.
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
Dies erstellt ein Regelobjekt, das englische Ordinalzahlenmuster versteht. Die Methode select() gibt einen Kategorienamen für jede Zahl zurück, die Sie ihr übergeben.
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
console.log(rules.select(1));
// Ausgabe: "one"
console.log(rules.select(2));
// Ausgabe: "two"
console.log(rules.select(3));
// Ausgabe: "few"
console.log(rules.select(4));
// Ausgabe: "other"
Die zurückgegebenen Kategorien sind linguistische Begriffe, nicht die tatsächlichen Suffixe. Die Kategorie "one" entspricht Zahlen, die im Englischen das Suffix st erhalten. Die Kategorie "two" entspricht nd-Suffixen. Die Kategorie "few" entspricht rd-Suffixen. Die Kategorie "other" entspricht th-Suffixen.
Sie ordnen diese Kategorienamen den entsprechenden Suffixen für Ihr Gebietsschema zu. Die API behandelt die komplexen Regeln zur Bestimmung, zu welcher Kategorie jede Zahl gehört.
Erstellen einer Funktion zur Formatierung von Ordinalzahlen
Um Ordinalzahlen zu formatieren, kombinieren Sie Intl.PluralRules mit einer Zuordnung von Pluralkategorien zu Suffixen. Erstellen Sie eine Formatierungsfunktion, die eine Zahl annimmt und die formatierte Zeichenkette zurückgibt.
function formatOrdinal(number, locale) {
const rules = new Intl.PluralRules(locale, { type: 'ordinal' });
const category = rules.select(number);
const suffixes = {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
};
const suffix = suffixes[category];
return `${number}${suffix}`;
}
console.log(formatOrdinal(1, 'en-US'));
// Output: "1st"
console.log(formatOrdinal(2, 'en-US'));
// Output: "2nd"
console.log(formatOrdinal(3, 'en-US'));
// Output: "3rd"
console.log(formatOrdinal(4, 'en-US'));
// Output: "4th"
Diese Funktion erstellt bei jedem Aufruf eine neue PluralRules-Instanz. Für eine bessere Performance sollten Sie das Rules-Objekt einmal erstellen und für mehrere Zahlen wiederverwenden.
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
const suffixes = {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
};
function formatOrdinal(number) {
const category = rules.select(number);
const suffix = suffixes[category];
return `${number}${suffix}`;
}
console.log(formatOrdinal(1));
// Output: "1st"
console.log(formatOrdinal(21));
// Output: "21st"
console.log(formatOrdinal(22));
// Output: "22nd"
console.log(formatOrdinal(23));
// Output: "23rd"
Die API behandelt Zahlen wie 11, 12 und 13 korrekt, die trotz ihrer Endziffern alle "th" verwenden.
console.log(formatOrdinal(11));
// Output: "11th"
console.log(formatOrdinal(12));
// Output: "12th"
console.log(formatOrdinal(13));
// Output: "13th"
Die Pluralregeln kodieren alle Sonderfälle und Ausnahmen für die Locale. Sie müssen keine bedingte Logik schreiben, um diese Sonderfälle zu behandeln.
Formatierung von Ordinalzahlen für verschiedene Locales
Die Pluralkategorien und ihre Bedeutungen ändern sich je nach Locale. Einige Sprachen haben weniger Kategorien als Englisch. Andere haben unterschiedliche Regeln dafür, welche Zahlen in welche Kategorie fallen.
Walisisch verwendet ein anderes Kategorisierungssystem. Die Regeln identifizieren mehr Kategorien, die jeweils verschiedenen Ordinalformen im Walisischen entsprechen.
const enRules = new Intl.PluralRules('en-US', { type: 'ordinal' });
const cyRules = new Intl.PluralRules('cy', { type: 'ordinal' });
console.log(enRules.select(1));
// Output: "one"
console.log(cyRules.select(1));
// Output: "one"
console.log(enRules.select(2));
// Output: "two"
console.log(cyRules.select(2));
// Output: "two"
console.log(enRules.select(5));
// Output: "other"
console.log(cyRules.select(5));
// Output: "many"
Um mehrere Locales zu unterstützen, benötigen Sie unterschiedliche Suffix-Zuordnungen für jede Locale. Die Kategorien bleiben gleich, aber die Suffixe ändern sich.
const ordinalSuffixes = {
'en-US': {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
},
'fr-FR': {
one: 'er',
other: 'e'
}
};
function formatOrdinal(number, locale) {
const rules = new Intl.PluralRules(locale, { type: 'ordinal' });
const category = rules.select(number);
const suffixes = ordinalSuffixes[locale];
const suffix = suffixes[category] || suffixes.other;
return `${number}${suffix}`;
}
console.log(formatOrdinal(1, 'en-US'));
// Output: "1st"
console.log(formatOrdinal(1, 'fr-FR'));
// Output: "1er"
console.log(formatOrdinal(2, 'en-US'));
// Output: "2nd"
console.log(formatOrdinal(2, 'fr-FR'));
// Output: "2e"
Dieser Ansatz funktioniert gut, wenn Sie die Suffix-Strings für jede Locale kontrollieren. Allerdings erfordert er die Pflege von Suffix-Daten für jede Locale, die Sie unterstützen.
Ordinale Pluralkategorien verstehen
Die Intl.PluralRules API verwendet sechs mögliche Kategorienamen. Verschiedene Sprachen nutzen unterschiedliche Teilmengen dieser Kategorien.
Die Kategorien sind zero, one, two, few, many und other. Nicht alle Sprachen unterscheiden zwischen allen sechs Kategorien. Englische Ordinalzahlen verwenden nur vier: one, two, few und other.
Die Kategorienamen entsprechen nicht direkt den numerischen Werten. Die Kategorie "one" umfasst 1, 21, 31, 41 und alle Zahlen, die auf 1 enden, außer 11. Die Kategorie "two" umfasst 2, 22, 32, 42 und alle Zahlen, die auf 2 enden, außer 12.
Sie können überprüfen, welche Kategorien eine Sprache verwendet, indem Sie die Methode resolvedOptions() aufrufen und die Eigenschaft pluralCategories untersuchen.
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
const options = rules.resolvedOptions();
console.log(options.pluralCategories);
// Ausgabe: ["one", "two", "few", "other"]
Dies zeigt, dass englische Ordinalzahlen vier Kategorien verwenden. Andere Sprachen verwenden unterschiedliche Kategoriensets.
const rules = new Intl.PluralRules('fr-FR', { type: 'ordinal' });
const options = rules.resolvedOptions();
console.log(options.pluralCategories);
// Ausgabe: ["one", "other"]
Französische Ordinalzahlen unterscheiden nur zwischen one und other. Diese einfachere Kategorisierung spiegelt die einfacheren Suffixregeln im Französischen wider.
Formatierung von Ordinalzahlen für die Sprache des Benutzers
Anstatt eine bestimmte Sprache fest zu codieren, können Sie die bevorzugte Sprache des Benutzers aus dem Browser verwenden. Die Eigenschaft navigator.language gibt die bevorzugte Sprache des Benutzers zurück.
const userLocale = navigator.language;
const rules = new Intl.PluralRules(userLocale, { type: 'ordinal' });
const suffixes = {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
};
function formatOrdinal(number) {
const category = rules.select(number);
const suffix = suffixes[category] || suffixes.other;
return `${number}${suffix}`;
}
console.log(formatOrdinal(1));
// Ausgabe variiert je nach Sprache des Benutzers
Dieser Ansatz passt sich automatisch an die Sprachpräferenz des Benutzers an. Sie müssen jedoch immer noch geeignete Suffix-Zuordnungen für jede Sprache bereitstellen, die Ihre Anwendung unterstützt.
Für Sprachen ohne spezifische Suffix-Zuordnungen können Sie auf ein Standardverhalten zurückgreifen oder die Zahl ohne Suffix anzeigen.
function formatOrdinal(number, locale = navigator.language) {
const rules = new Intl.PluralRules(locale, { type: 'ordinal' });
const category = rules.select(number);
const localeMapping = ordinalSuffixes[locale];
if (!localeMapping) {
return String(number);
}
const suffix = localeMapping[category] || localeMapping.other || '';
return `${number}${suffix}`;
}
Diese Funktion gibt nur die Zahl zurück, wenn keine Suffix-Zuordnung für die Sprache existiert.
Häufige Anwendungsfälle für Ordnungszahlen
Ordnungszahlen erscheinen in mehreren gängigen Kontexten in Benutzeroberflächen. Das Verständnis dieser Anwendungsfälle hilft Ihnen zu entscheiden, wann Zahlen als Ordnungszahlen formatiert werden sollten.
Rankings und Bestenlisten zeigen Benutzerpositionen an. Eine Spielanwendung zeigt "1. Platz", "2. Platz", "3. Platz" anstelle von "Platz 1", "Platz 2", "Platz 3" an.
function formatRanking(position) {
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
const category = rules.select(position);
const suffixes = {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
};
const suffix = suffixes[category];
return `${position}${suffix} place`;
}
console.log(formatRanking(1));
// Output: "1st place"
console.log(formatRanking(42));
// Output: "42nd place"
Datumsformatierung verwendet manchmal Ordnungszahlen für den Tag des Monats. Einige Sprachversionen schreiben "1. Januar" anstatt "Januar 1".
Schritt-für-Schritt-Anleitungen verwenden Ordnungszahlen, um jeden Schritt zu nummerieren. Ein Tutorial zeigt "1. Schritt: Software installieren", "2. Schritt: Einstellungen konfigurieren", "3. Schritt: Anwendung starten".
Listenelemente in langen Sequenzen profitieren von der Ordnungszahlenformatierung, wenn die Betonung der Position wichtiger ist als die bloße Aufzählung.
Wiederverwendung von Rules-Objekten für bessere Performance
Die Erstellung einer neuen Intl.PluralRules-Instanz beinhaltet das Laden von Sprachdaten und die Verarbeitung von Optionen. Wenn Sie mehrere Ordnungszahlen mit derselben Spracheinstellung formatieren, erstellen Sie das Rules-Objekt einmal und verwenden es wieder.
const rules = new Intl.PluralRules('en-US', { type: 'ordinal' });
const suffixes = {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
};
function formatOrdinal(number) {
const category = rules.select(number);
const suffix = suffixes[category];
return `${number}${suffix}`;
}
const positions = [1, 2, 3, 4, 5];
positions.forEach(position => {
console.log(formatOrdinal(position));
});
// Output:
// "1st"
// "2nd"
// "3rd"
// "4th"
// "5th"
Dieser Ansatz ist effizienter als die Erstellung eines neuen Rules-Objekts für jede Zahl. Der Leistungsunterschied wird signifikant, wenn Arrays mit Hunderten oder Tausenden von Werten formatiert werden.
Sie können auch eine Formatter-Factory erstellen, die eine für eine bestimmte Spracheinstellung konfigurierte Funktion zurückgibt.
function createOrdinalFormatter(locale, suffixMapping) {
const rules = new Intl.PluralRules(locale, { type: 'ordinal' });
return function(number) {
const category = rules.select(number);
const suffix = suffixMapping[category] || suffixMapping.other || '';
return `${number}${suffix}`;
};
}
const formatEnglishOrdinal = createOrdinalFormatter('en-US', {
one: 'st',
two: 'nd',
few: 'rd',
other: 'th'
});
console.log(formatEnglishOrdinal(1));
// Output: "1st"
console.log(formatEnglishOrdinal(2));
// Output: "2nd"
Dieses Muster kapselt das Rules-Objekt und das Suffix-Mapping zusammen, wodurch der Formatter in Ihrer Anwendung leicht wiederverwendet werden kann.