Executando verificação de segurança...
6

JavaScript: Intl + objeto navigator

Algo que as vezes pode ser meio confuso ou então algo que faça você pensar que é necessário uma biblioteca externa para fazer é a questão de "traduzir" datas ou moedas de acordo com o local em que o usuário está no mundo, mas isso é possível de fazer no JavaScript de forma pura e não vale só para moeda e datas, nessa publicação vou mostrar exemplos simples mas que podem ser aplicados em outros contextos.

Como saber qual o idioma do meu usuário?

Isso é bastante simples, basta usarmos o objeto navigator, nele temos uma propriedade chamada language que nos retorna uma string por exemplo pt-BR.

const language = navigator.language;

Sabendo o idioma do nosso usuário basta agora criar um objeto de data e formatá-lo com o Intl:

const language = navigator.language;
const date = new Date();
const today = new Intl.DateTimeFormat(language).format(date);

Com isso já teremos a data no formato de acordo com o local em que estamos.

Formatar moeda

Já sabemos como saber o idioma do usuário, agora com o Intl veremos como lidar com moedas:

const value = 10987;
const money = new Intl.NumberFormat(language, {
    style: 'currency',
    currency: 'BRL',
}).format(value);

Esses pequenos exemplos que mostrei são apenas a introdução ao assunto, mas da para fazer muito mais coisas, por isso estou deixando o link da documentação, espero que pra quem nunca tinha visto o Intl e o navigator tenha sido algo de ajuda

Outra sugestão é a biblioteca date-fns, vale a pena dar uma olhada ;)

Carregando publicação patrocinada...
3

ffavareto, ótima publicação! Eu desconhecia o combo Intl com navigator, simplesmente sensacional e muito obrigado por trazer esse conteúdo para o TabNews 🤝

Em paralelo, uma sugestão que tenho para melhorar a formatação da sua publicação é declarar a linguagem js no bloco de código, por exemplo:

```js
const language = navigator.language;
const date = new Date();
const today = new Intl.DateTimeFormat(language).format(date);
```

Ficará:

const language = navigator.language;
const date = new Date();
const today = new Intl.DateTimeFormat(language).format(date);