¿Cómo puedo mostrar el año y la era en calendarios no gregorianos?

Utiliza las opciones de calendario y era en Intl.DateTimeFormat para mostrar años y eras de los sistemas de calendario islámico, hebreo, chino, persa y otros

Introducción

El calendario gregoriano cuenta los años desde un único punto de partida, haciendo que el año 2024 sea un número sencillo. Otros sistemas de calendario cuentan los años de manera diferente. El calendario islámico cuenta desde el año 622 EC. El calendario hebreo cuenta desde una fecha tradicional de la creación hace miles de años. El calendario chino utiliza un ciclo de 60 años con nombres específicos en lugar de números secuenciales.

Estos diferentes sistemas de conteo significan que el mismo momento en el tiempo tiene diferentes representaciones de año en distintos calendarios. El 15 de octubre de 2024 en el calendario gregoriano es el año 1446 en el calendario islámico, el año 5785 en el calendario hebreo y el año 2024 (甲辰, jiǎ-chén) en el calendario chino.

El Intl.DateTimeFormat de JavaScript proporciona opciones para mostrar años y eras de cualquier sistema de calendario. La opción calendar selecciona qué calendario usar. Las opciones year y era controlan cómo se muestran el año y la era. Para calendarios que utilizan años con nombres en lugar de números, el método formatToParts() proporciona acceso tanto al nombre del año como al año gregoriano correspondiente.

Cómo difieren los años entre sistemas de calendario

Los sistemas de calendario difieren en tres formas fundamentales: dónde comienzan a contar, cómo numeran los años y si utilizan eras.

El calendario gregoriano comienza a contar desde el año 1 EC y se incrementa secuencialmente. El calendario islámico comienza desde el año 1 AH (Después de la Hégira) en el 622 EC. El calendario hebreo comienza desde el año 1 en el 3761 AEC. Cada calendario tiene su propia época, el punto donde comienza el conteo de años.

Algunos calendarios utilizan números de año secuenciales que aumentan indefinidamente. Los calendarios gregoriano, islámico, hebreo y persa funcionan de esta manera. Otros calendarios utilizan ciclos donde los nombres de los años se repiten. El calendario chino utiliza un ciclo de 60 años con nombres específicos. Después de 60 años, el ciclo se repite.

Las eras dividen el tiempo en períodos con nombres. El calendario gregoriano utiliza AC y DC. El calendario japonés utiliza nombres de eras imperiales. Los calendarios islámico y hebreo típicamente utilizan una sola era que comenzó en su época. El calendario chino no utiliza eras de la misma manera, dependiendo en cambio de años con nombres dentro de ciclos.

Mostrar años en el calendario islámico

El calendario islámico cuenta los años desde la Hégira, la migración de Mahoma desde La Meca a Medina en el año 622 EC. El año islámico 1 corresponde al año gregoriano 622. El calendario islámico utiliza meses lunares, lo que hace que sus años sean más cortos que los años gregorianos. Esto significa que el año islámico avanza más rápido, alcanzando actualmente el año 1446 cuando el año gregoriano es 2024.

Se especifica el calendario islámico utilizando la opción calendar con el valor islamic o añadiendo la extensión Unicode -u-ca-islamic al identificador de localización.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(formatter.format(date));
// "Rabi' II 12, 1446 AH"

El año se muestra como 1446, que es el año islámico correspondiente al 15 de octubre de 2024. La era "AH" (After Hijra) aparece automáticamente cuando se muestran fechas islámicas en inglés.

Diferentes localizaciones formatean las fechas islámicas según sus convenciones.

const date = new Date('2024-10-15');

const en = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(en.format(date));
// "Rabi' II 12, 1446 AH"

const ar = new Intl.DateTimeFormat('ar-SA', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(ar.format(date));
// "١٢ ربيع الآخر ١٤٤٦ هـ"

La localización árabe utiliza numerales arábigo-índicos y muestra el nombre del mes en árabe. El indicador de era cambia a "هـ" (la abreviatura árabe para Hijri).

Controlar la visualización de la era en el calendario islámico

La opción era controla si se muestra el indicador de era y cómo se muestra. La opción acepta tres valores: long para el nombre completo de la era, short para una abreviatura y narrow para la forma más compacta.

const date = new Date('2024-10-15');

const long = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  era: 'long'
});
console.log(long.format(date));
// "1446 Anno Hegirae"

const short = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  era: 'short'
});
console.log(short.format(date));
// "1446 AH"

const narrow = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  era: 'narrow'
});
console.log(narrow.format(date));
// "1446 A"

El valor long produce "Anno Hegirae" (latín para "en el año de la Hégira"). El valor short produce "AH". El valor narrow produce solo "A".

Variantes del calendario islámico

El calendario islámico tiene varias variantes que utilizan diferentes métodos de cálculo. JavaScript admite cinco variantes: islamic, islamic-civil, islamic-tbla, islamic-umalqura e islamic-rgsa.

La variante islamic-umalqura utiliza el calendario oficial de Arabia Saudita, que se basa en observaciones astronómicas. La variante islamic-civil utiliza un cálculo aritmético fijo con meses alternos de 29 y 30 días.

const date = new Date('2024-10-15');

const umalqura = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic-umalqura',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(umalqura.format(date));
// "Rabi' II 12, 1446 AH"

const civil = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic-civil',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(civil.format(date));
// "Rabi' II 11, 1446 AH"

Las variantes pueden producir diferentes números de día para la misma fecha gregoriana porque utilizan diferentes métodos de cálculo para determinar los límites de los meses.

Mostrar años en el calendario hebreo

El calendario hebreo cuenta los años desde una fecha tradicional de la creación en el 3761 a.C. Esto hace que los años hebreos sean mucho mayores que los años gregorianos. El año hebreo 5785 corresponde al año gregoriano 2024.

Se especifica el calendario hebreo utilizando la opción calendar con el valor hebrew o añadiendo la extensión Unicode -u-ca-hebrew al identificador de localización.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('en-US', {
  calendar: 'hebrew',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(formatter.format(date));
// "Tishrei 13, 5785"

El año se muestra como 5785, que es el año hebreo correspondiente al 15 de octubre de 2024. El calendario hebreo es lunisolar, lo que significa que sus meses siguen la luna pero sus años permanecen sincronizados con el año solar mediante meses bisiestos periódicos.

Las fechas hebreas en la localización hebrea utilizan numerales y nombres de meses hebreos.

const date = new Date('2024-10-15');

const he = new Intl.DateTimeFormat('he-IL', {
  calendar: 'hebrew',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(he.format(date));
// "י״ג בתשרי ה׳תשפ״ה"

La localización hebrea muestra la fecha completamente en hebreo, incluyendo letras hebreas utilizadas como numerales.

Mostrar años en el calendario chino

El calendario chino utiliza un ciclo de 60 años con nombres en lugar de números secuenciales. Cada año en el ciclo tiene un nombre compuesto por dos caracteres: un tallo celestial y una rama terrenal. El año 2024 es 甲辰 (jiǎ-chén), que significa "dragón de madera" en la astrología tradicional china.

Debido a que el calendario chino utiliza años con nombres, mostrarlos requiere un manejo diferente al de los calendarios con números de año secuenciales.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('en-US', {
  calendar: 'chinese',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(formatter.format(date));
// "Ninth Month 13, 2024(jiǎ-chén)"

El resultado formateado incluye tanto el año gregoriano 2024 como el nombre del año "jiǎ-chén" entre paréntesis. Esta representación dual ayuda a los usuarios a entender tanto el nombre cíclico del año como el año gregoriano correspondiente.

Las fechas chinas en el idioma chino se muestran utilizando caracteres chinos.

const date = new Date('2024-10-15');

const zh = new Intl.DateTimeFormat('zh-CN', {
  calendar: 'chinese',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(zh.format(date));
// "2024甲辰年九月十三"

El idioma chino muestra el nombre del año usando caracteres chinos. El formato integra el nombre del año de manera natural en la cadena de fecha.

Extraer el nombre del año y el año relacionado

Los calendarios que utilizan años con nombres proporcionan dos piezas de información: el nombre del año dentro del ciclo y el año gregoriano correspondiente. El método formatToParts() separa estos elementos en partes distintas.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('zh-CN', {
  calendar: 'chinese',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

const parts = formatter.formatToParts(date);
console.log(parts);

El array de partes incluye dos entradas relevantes:

[
  { type: 'relatedYear', value: '2024' },
  { type: 'yearName', value: '甲辰' },
  // ... otras partes
]

La parte relatedYear contiene el año gregoriano de cuatro dígitos. La parte yearName contiene el nombre cíclico del año. Esta separación te permite usar cualquiera de los valores o ambos en formateos personalizados.

Puedes extraer estas partes para crear visualizaciones de fecha personalizadas.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('zh-CN', {
  calendar: 'chinese',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

const parts = formatter.formatToParts(date);
const yearName = parts.find(p => p.type === 'yearName')?.value;
const relatedYear = parts.find(p => p.type === 'relatedYear')?.value;

console.log(`Year name: ${yearName}`);
// "Year name: 甲辰"

console.log(`Gregorian year: ${relatedYear}`);
// "Gregorian year: 2024"

Esta técnica funciona con cualquier calendario que utilice años con nombres o ciclos.

Mostrar años en el calendario persa

El calendario persa, también conocido como calendario Solar Hijri, cuenta los años desde la Hégira en el 622 EC, la misma época que el calendario islámico. Sin embargo, el calendario persa utiliza meses solares en lugar de meses lunares, lo que lo hace más similar al calendario gregoriano en estructura.

Se especifica el calendario persa utilizando la opción calendar con el valor persian o añadiendo la extensión Unicode -u-ca-persian al identificador de localización.

const date = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('en-US', {
  calendar: 'persian',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(formatter.format(date));
// "Mehr 24, 1403 AP"

El año se muestra como 1403, que es el año persa correspondiente al 15 de octubre de 2024. La era "AP" (Anno Persico) aparece en el formato en inglés.

Las fechas persas en la localización persa utilizan numerales y nombres de meses persas.

const date = new Date('2024-10-15');

const fa = new Intl.DateTimeFormat('fa-IR', {
  calendar: 'persian',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(fa.format(date));
// "۲۴ مهر ۱۴۰۳ ه‍.ش."

La localización persa muestra la fecha utilizando caracteres y numerales persas (farsi). El indicador de era "ه‍.ش." es la abreviatura persa para la era Solar Hijri.

Combinar opciones de calendario y era

Puedes combinar las opciones calendar y era para controlar exactamente cómo se muestran los años y las eras en diferentes sistemas de calendario. Esta combinación te da un control preciso sobre el formato de fecha.

const date = new Date('2024-10-15');

const gregorian = new Intl.DateTimeFormat('en-US', {
  calendar: 'gregory',
  year: 'numeric',
  month: 'long',
  era: 'short'
});
console.log(gregorian.format(date));
// "October 2024 AD"

const islamic = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  era: 'short'
});
console.log(islamic.format(date));
// "Rabi' II 1446 AH"

const hebrew = new Intl.DateTimeFormat('en-US', {
  calendar: 'hebrew',
  year: 'numeric',
  month: 'long',
  era: 'short'
});
console.log(hebrew.format(date));
// "Tishrei 5785"

Las fechas gregorianas e islámicas muestran sus indicadores de era porque la opción era está establecida. La fecha hebrea no muestra un indicador de era en este formato, ya que el formato del calendario hebreo típicamente lo omite.

También puedes mezclar localizaciones y calendarios para mostrar fechas en un idioma utilizando el calendario de otra cultura.

const date = new Date('2024-10-15');

const englishIslamic = new Intl.DateTimeFormat('en-US', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(englishIslamic.format(date));
// "Rabi' II 12, 1446 AH"

const arabicIslamic = new Intl.DateTimeFormat('ar-SA', {
  calendar: 'islamic',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});
console.log(arabicIslamic.format(date));
// "١٢ ربيع الآخر ١٤٤٦ هـ"

Ambos formateadores utilizan el calendario islámico, pero la localización en inglés produce nombres de meses en inglés y numerales latinos, mientras que la localización árabe produce nombres de meses en árabe y numerales árabe-índicos.

Mostrar años en múltiples calendarios

Las aplicaciones que sirven a audiencias internacionales a menudo necesitan mostrar la misma fecha en múltiples sistemas de calendario. Puedes crear varios formateadores para mostrar representaciones paralelas.

const date = new Date('2024-10-15');

const calendars = [
  { name: 'Gregorian', calendar: 'gregory' },
  { name: 'Islamic', calendar: 'islamic' },
  { name: 'Hebrew', calendar: 'hebrew' },
  { name: 'Persian', calendar: 'persian' }
];

calendars.forEach(cal => {
  const formatter = new Intl.DateTimeFormat('en-US', {
    calendar: cal.calendar,
    year: 'numeric',
    month: 'long',
    day: 'numeric'
  });
  console.log(`${cal.name}: ${formatter.format(date)}`);
});

Esto produce:

Gregorian: October 15, 2024
Islamic: Rabi' II 12, 1446 AH
Hebrew: Tishrei 13, 5785
Persian: Mehr 24, 1403 AP

Cada calendario representa el mismo momento en el tiempo utilizando su propio sistema de conteo de años e indicadores de era.

Casos de uso comunes

Las aplicaciones internacionales necesitan mostrar fechas en los sistemas de calendario que sus usuarios esperan. Una aplicación de banca islámica muestra las fechas de transacciones utilizando el calendario islámico.

const transactionDate = new Date('2024-10-15');

const formatter = new Intl.DateTimeFormat('ar-SA', {
  calendar: 'islamic-umalqura',
  year: 'numeric',
  month: 'long',
  day: 'numeric',
  era: 'short'
});

console.log(`Transaction date: ${formatter.format(transactionDate)}`);
// "Transaction date: ١٢ ربيع الآخر ١٤٤٦ هـ"

Los calendarios religiosos determinan las fechas de festividades y observancias. Una aplicación de calendario judío muestra fechas hebreas para las festividades.

const roshHashanah2024 = new Date('2024-10-03');

const formatter = new Intl.DateTimeFormat('he-IL', {
  calendar: 'hebrew',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(`Rosh Hashanah: ${formatter.format(roshHashanah2024)}`);
// "Rosh Hashanah: א׳ בתשרי ה׳תשפ״ה"

Las aplicaciones históricas muestran fechas en los sistemas de calendario utilizados en la época. Una aplicación sobre la antigua Persia muestra fechas utilizando el calendario persa.

const historicalDate = new Date('2024-03-20');

const formatter = new Intl.DateTimeFormat('en-US', {
  calendar: 'persian',
  year: 'numeric',
  month: 'long',
  day: 'numeric',
  era: 'long'
});

console.log(`Persian New Year: ${formatter.format(historicalDate)}`);
// "Persian New Year: Farvardin 1, 1403 Anno Persico"

Resumen

Los calendarios no gregorianos cuentan los años desde diferentes puntos de partida y utilizan diferentes sistemas de numeración. El calendario islámico cuenta desde el año 622 EC y actualmente muestra años alrededor del 1446. El calendario hebreo cuenta desde el 3761 AEC y muestra años alrededor del 5785. El calendario chino utiliza un ciclo de 60 años con nombres en lugar de números secuenciales.

El Intl.DateTimeFormat de JavaScript admite estos sistemas de calendario a través de la opción calendar. Los valores incluyen islamic, hebrew, chinese, persian y otros. La opción year controla si se muestra el año, y la opción era controla si se muestra el indicador de era y cómo se muestra.

Los calendarios que utilizan años con nombres proporcionan dos piezas de información a través de formatToParts(). La parte yearName contiene el nombre cíclico del año. La parte relatedYear contiene el año gregoriano correspondiente. Esto permite a las aplicaciones mostrar cualquiera de los valores o ambos.

Diferentes locales formatean el mismo calendario de diferentes maneras. El calendario islámico se muestra en inglés con números latinos y en árabe con números árabe-índicos. El formato se adapta automáticamente a las convenciones locales mientras mantiene el sistema de numeración de años del calendario.