Internacionalización en ES6 1: La clase Collator

Hoy comenzamos una nueva etapa, en la que iremos descubriendo que nos ofrecerá ES6 (EcmaScript 6, o JavaScript 6 para los amigos). A lo largo de una serie de artículos iremos analizando las novedades y cambios que la nueva versión del lenguaje nos ofrecerá, así como su estado actual de integración en los principales navegadores. En este primer artículo descubriremos el namespace Intl y la clase Collator.

El namespace Intl

Cuando se desarrolla una web, hasta ahora cuando teníamos que internacionalizarla nos encontrábamos con diversos problemas que se debían resolver creando funciones específicas o mediante el uso de librerías destinadas a tal fin. Sin embargo, la próxima versión de ES, tiende una mano a los desarrolladores y desarrolladoras para hacernos la vida más fácil, todo mediante la inclusión de Intl.

El objeto Intl hace las veces de namespace para lo que se conoce como ECMAScript Internationalization API, que proporciona comparación de cadenas dependiendo del idioma, formato para números, así como para fecha y hora. Los constructores para los objetos Collator, NumberFormat, y DateTimeFormat son propiedades del objeto Intl.

La clase Collator

Hasta ahora al intentar ordenar cadenas, teníamos el problema de que para ese orden no se tenía en cuenta el idioma, por lo que por ejemplo, obteníamos resultados como el siguiente.

var items = ['d', 'n', 'a', 'z', 'ñ', 'o'];
console.log(items.sort());
// Resultado: a,d,n,o,z,ñ

Como podemos observar, aunque la ñ en nuestro alfabeto se encuentra tras la letra n, el orden por defecto de ES, la sitúa al final.

La clase Collator viene a resolver dicho problema, ya que una vez que le indiquemos el idioma a utilizar, realizará el orden correcto, si la pasamos como argumento a la función sort(). Su sintaxis es la siguiente:

new Intl.Collator([locales[, opciones]])

El parámetro obligatorio es el idioma o array de idiomas a utilizar, para ello se indica con cadenas que definen el idioma con formato BCP 47.

A continuación podéis ver un ejemplo de uso.

Finalmente, en cada artículo indicaremos con qué navegadores es compatible la funcionalidad vista. Para ello, en el caso de estar disponible, se indicará a partir de qué versión se puede utilizar.

Tipo Android Chrome Edge Firefox Internet Explorer Opera Safari
Escritorio N/A 24 Todas 29 11 15 No soportado
Móvil No soportado 26 N/A No soportado No soportado No soportado No soportado

Enlaces

También te podría gustar...

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

El tiempo límite ha expirado. Por favor, recarga el CAPTCHA.