Pular para o conteúdo principal

`Intl.DisplayNames`

· Leitura de 4 minutos
Shu-yu Guo ([@_shu](https://twitter.com/_shu)) e Frank Yung-Fong Tang

Aplicações web que alcançam uma audiência global precisam exibir os nomes de exibição de idiomas, regiões, scripts e moedas em muitos idiomas diferentes. As traduções desses nomes requerem dados, que estão disponíveis no Unicode CLDR. Incluir esses dados como parte da aplicação implica em um custo no tempo de desenvolvimento. Os usuários provavelmente preferem traduções consistentes de nomes de idiomas e regiões, e manter esses dados atualizados com os acontecimentos geopolíticos do mundo exige manutenção constante.

Felizmente, a maioria dos tempos de execução JavaScript já têm e mantêm esses mesmos dados de tradução atualizados. A nova API Intl.DisplayNames dá aos desenvolvedores JavaScript acesso direto a essas traduções, permitindo que as aplicações exibam nomes localizados mais facilmente.

Exemplos de uso​

O exemplo a seguir mostra como criar um objeto Intl.DisplayNames para obter nomes de regiões em inglês usando códigos de países de 2 letras ISO-3166.

const regionNames = new Intl.DisplayNames(['en'], { type: 'region' });
regionNames.of('US');
// → 'United States'
regionNames.of('BA');
// → 'Bosnia & Herzegovina'
regionNames.of('MM');
// → 'Myanmar (Burma)'

O exemplo a seguir obtém nomes de idiomas em chinês tradicional usando a gramática de identificador de idioma Unicode.

const languageNames = new Intl.DisplayNames(['zh-Hant'], { type: 'language' });
languageNames.of('fr');
// → '法文'
languageNames.of('zh');
// → '中文'
languageNames.of('de');
// → '德文'

O exemplo a seguir obtém nomes de moedas em chinês simplificado usando códigos de moedas de 3 letras ISO-4217. Em idiomas que têm formas singulares e plurais distintas, os nomes das moedas estão no singular. Para formas plurais, Intl.NumberFormat pode ser usado.

const currencyNames = new Intl.DisplayNames(['zh-Hans'], {type: 'currency'});
currencyNames.of('USD');
// → '美元'
currencyNames.of('EUR');
// → '欧元'
currencyNames.of('JPY');
// → '日元'
currencyNames.of('CNY');
// → '人民币'

O exemplo a seguir mostra o tipo final suportado, scripts, em inglês, usando códigos de scripts de 4 letras ISO-15924.

const scriptNames = new Intl.DisplayNames(['en'], { type: 'script' });
scriptNames.of('Latn');
// → 'Latin'
scriptNames.of('Arab');
// → 'Arabic'
scriptNames.of('Kana');
// → 'Katakana'

Para usos mais avançados, o segundo parâmetro options também suporta a propriedade style. A propriedade style corresponde à largura do nome de exibição e pode ser "long", "short" ou "narrow". Os valores para diferentes estilos nem sempre diferem. O padrão é "long".

const longLanguageNames = new Intl.DisplayNames(['en'], { type: 'language' });
longLanguageNames.of('en-US');
// → 'American English'
const shortLanguageNames = new Intl.DisplayNames(['en'], { type: 'language', style: 'short' });
shortLanguageNames.of('en-US');
// → 'US English'
const narrowLanguageNames = new Intl.DisplayNames(['en'], { type: 'language', style: 'narrow' });
narrowLanguageNames.of('en-US');
// → 'US English'

API Completa​

A API completa para Intl.DisplayNames é a seguinte.

Intl.DisplayNames(locales, options)
Intl.DisplayNames.prototype.of( code )

O construtor é consistente com outras APIs Intl. Seu primeiro argumento é uma lista de locais, e seu segundo parâmetro é um parâmetro options que aceita as propriedades localeMatcher, type e style.

A propriedade "localeMatcher" é tratada da mesma forma que em outras APIs Intl. A propriedade type pode ser "region", "language", "currency" ou "script". A propriedade style pode ser "long", "short" ou "narrow", sendo "long" o padrão.

Intl.DisplayNames.prototype.of( code ) espera os seguintes formatos, dependendo do type de como a instância é construída.

Conclusão​

Como outras APIs Intl, à medida que Intl.DisplayNames se tornam mais amplamente disponíveis, bibliotecas e aplicativos optarão por deixar de empacotar e enviar seus próprios dados de tradução em favor de usar a funcionalidade nativa.

Suporte a Intl.DisplayNames​