JavaScript Academy · Lektion

Relative Zeit und Pluralformen

Verwenden Sie RelativeTimeFormat und PluralRules.

Relative Zeit und Pluralformen ist eine kostenlose JavaScript Academy-Lektion auf CoddyKit. Dies ist Lektion 3 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des JavaScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der JavaScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Intl.RelativeTimeFormat

Intl.RelativeTimeFormat erzeugt Formulierungen wie „vor 3 Tagen“ oder „in 2 Stunden“ in der Sprache der Nutzerin oder des Nutzers.

const rtf = new Intl.RelativeTimeFormat("en-US");
console.log(rtf.format(-1, "day")); // "1 day ago"
console.log(rtf.format(2, "hour"));  // "in 2 hours"

Negativ für die Vergangenheit, positiv für die Zukunft

Das Vorzeichen der Zahl legt die Richtung fest: Ein negativer Wert bezeichnet die Vergangenheit, ein positiver die Zukunft.

const rtf = new Intl.RelativeTimeFormat("en-US");
console.log(rtf.format(-3, "week")); // "3 weeks ago"
console.log(rtf.format(5, "minute")); // "in 5 minutes"

Die numeric-Option

numeric: "auto" verwendet idiomatische Wörter wie „gestern“ oder „morgen“ statt „vor 1 Tag“.

const rtf = new Intl.RelativeTimeFormat("en-US", { numeric: "auto" });
console.log(rtf.format(-1, "day")); // "yesterday"
console.log(rtf.format(0, "day"));  // "today"

Lokalisierte relative Zeitangaben

Wenn Sie die Locale wechseln, wird die gesamte Formulierung automatisch übersetzt.

console.log(new Intl.RelativeTimeFormat("es").format(-2, "day")); // "hace 2 dias"
console.log(new Intl.RelativeTimeFormat("fr").format(3, "hour")); // "dans 3 heures"

Die passende Einheit auswählen

In echten Anwendungen wird die größte sinnvolle Einheit ausgewählt. Berechnen Sie die Differenz in Sekunden und arbeiten Sie sich schrittweise durch die Einheiten nach unten.

function ago(date) {
  const diff = (date - Date.now()) / 1000;
  const rtf = new Intl.RelativeTimeFormat("en-US", { numeric: "auto" });
  if (Math.abs(diff) < 60) return rtf.format(Math.round(diff), "second");
  if (Math.abs(diff) < 3600) return rtf.format(Math.round(diff / 60), "minute");
  return rtf.format(Math.round(diff / 3600), "hour");
}
console.log(ago(new Date(Date.now() - 90000)));

Intl.PluralRules

Pluralbildung bedeutet mehr, als einfach ein „s“ anzuhängen. Intl.PluralRules ordnet eine Zahl je nach Sprache einer Kategorie wie "one" oder "other" zu.

const pr = new Intl.PluralRules("en-US");
console.log(pr.select(1)); // "one"
console.log(pr.select(2)); // "other"
console.log(pr.select(0)); // "other"

Pluralformen in Nachrichten verwenden

Verwenden Sie die Kategorie, um das richtige Wort auszuwählen.

const pr = new Intl.PluralRules("en-US");
const forms = { one: "item", other: "items" };
function label(n) { return n + " " + forms[pr.select(n)]; }
console.log(label(1)); // "1 item"
console.log(label(5)); // "5 items"

Sprachen mit mehr Pluralformen

Viele Sprachen haben mehrere Pluralkategorien. Im Polnischen wird beispielsweise zwischen "few" und "many" unterschieden – eine fest codierte englische Logik wäre falsch.

const pr = new Intl.PluralRules("pl");
console.log(pr.select(1)); // "one"
console.log(pr.select(3)); // "few"
console.log(pr.select(5)); // "many"

Ordinalpluralformen

Übergeben Sie type: "ordinal", um Kategorien für Ordnungszahlen wie 1st, 2nd und 3rd zu erhalten.

const pr = new Intl.PluralRules("en-US", { type: "ordinal" });
const suffix = { one: "st", two: "nd", few: "rd", other: "th" };
function ordinal(n) { return n + suffix[pr.select(n)]; }
console.log(ordinal(1), ordinal(2), ordinal(3), ordinal(11)); // 1st 2nd 3rd 11th

Mit Zahlen kombinieren

Kombinieren Sie PluralRules mit NumberFormat, um vollständig lokalisierte Zähltexte zu erstellen.

const nf = new Intl.NumberFormat("en-US");
const pr = new Intl.PluralRules("en-US");
const forms = { one: "file", other: "files" };
function msg(n) { return nf.format(n) + " " + forms[pr.select(n)]; }
console.log(msg(1000)); // "1,000 files"

Intl.ListFormat

Als Ergänzung verbindet Intl.ListFormat Elemente mit den korrekten Konjunktionen der jeweiligen Locale.

const lf = new Intl.ListFormat("en-US", { type: "conjunction" });
console.log(lf.format(["red", "green", "blue"])); // "red, green, and blue"

Schnelltest

Testen Sie relative Zeitangaben und Pluralformen.

Zusammenfassung: Relative Zeitangaben und Pluralformen

Sie haben relative Zeitangaben mit RelativeTimeFormat formatiert, einschließlich numeric: "auto", Einheitsgrenzen ausgewählt, mit PluralRules über verschiedene Sprachen und bei Ordnungszahlen hinweg korrekte Pluralformen verwendet und Listen mit ListFormat verbunden. Als Nächstes geht es um Locale-bewusstes Sortieren.

Häufig gestellte Fragen

Ist die Lektion „Relative Zeit und Pluralformen“ kostenlos?

Ja — der vollständige Text von „Relative Zeit und Pluralformen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des JavaScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der JavaScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „Relative Zeit und Pluralformen“?

Verwenden Sie RelativeTimeFormat und PluralRules. Du übst JavaScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um JavaScript Academy zu starten?

Keine Vorkenntnisse erforderlich. JavaScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 3 von 4.

Wie lange dauert die Lektion „Relative Zeit und Pluralformen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser JavaScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede JavaScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

← Zurück zu JavaScript Academy