Ir al contenido

Fechas relativas en Javascript

Una de las cosas interesantes de la librería de internacionalización representada en el objeto Intl es el manejo de fechas relativas en Javascript. Dicho manejo nos permite representar una fecha atendiendo a elemento relativos, es decir, poder especificar cual fue el día de ayer, o antes de ayer, o dentro de tres meses,… y todo ello atendiendo a la localización que le indiquemos, por lo cual podremos especificar literalmente este contenido.

Para ello lo primero que vamos a hacer es crear un objeto Intl. En concreto vamos a instanciar el objeto RelativeTimeFormat.

let rtf = new Intl.RelativeTimeFormat(locale, options);

Este objeto recibe dos parámetros, la etiqueta de localización representada por un código BCP 47 en la que los dos primero caracteres representan el idioma, luego encontraremos un guión y luego dos caracteres que representan al país. Así encontraremos ‘es-ES’, ‘ca-ES’, ‘en-UK’, ‘en-US’, ‘ar-EG’,…

El segundo parámetro los las opciones en las que queremos representar el contenido de la fecha. Estas opciones se representan en formato JSON. Las tres propiedades que hay en las opciones son:

  • style, cómo queremos que sea la longitud del texto, que puede ser ‘long’, ‘short’ o ‘narrow’.
  • numeric, si queremos que los números se representen en formato numérico, daríamos el valor ‘always’ o en formato textual, que daríamos el valor ‘auto’.
  • localeMatcher, que indica el algoritmo de matching a ejecutar y cuyos valores pueden ser ‘lookup’ o ‘best fit’.

Así la creación de nuestro objeto RelativeTimeFormat quedará de la siguiente forma:

let rtf = new Intl.RelativeTimeFormat('es-ES', { style: 'long', numeric: 'auto' });

Lo siguiente será apoyarnos en el método .format() el cual recibe dos parámetros, el primero numérico positivo o negativo con la relatividad y el segundo el tamaño de la relatividad, si queremos que sea meses, días, años,…

De esta forma si queremos que nos indique el día de ayer escribiremos:

rtf.format(-1, 'day'); // ayer

Pero si queremos indicar que sea pasado mañana lo pondríamos de la siguiente forma:

rtf.format(2, 'day'); // pasado mañana

Podemos utilizar la medida de meses, así el mes pasado sería:

rtf.format(-1, 'month'); // el mes pasado

O incluso podemos utilizar trimestres, así dentro de tres trimestres sera:

rtf.format(3, 'quarter'); // dentro de 3 trimestres

Como vemos es muy sencillo utilizar el objeto RelativeTimeFormat para poder representar Fechas relativas en Javascript de una forma localizada.

Foto de Víctor Cuervo

Víctor Cuervo

Programador, Arquitecto IT, álter ego de Línea de Código, amante de las tecnologías, generador de conocimiento y facilitador del aprendizaje.

Descarga el código de Fechas relativas en Javascript

Cómo poder prepresentar fechas relativas en Javascript con texto de forma localizada a un idioma y país mediante el objeto Intl.RelativeTimeFormat.

Descargar código