Trabalhando com datas e substituindo o Moment.JS
Tags: javascript
Published: 2020-12-31 12:54:24

_Créditos da imagem de capa: Calendly_

Para quem não sabe em meados de 2020 as pessoas desenvolvedoras da biblioteca Moment.JS resolveram descontinuar os updates do mesmo devido as constantes mudanças das tecnologias com o passar os anos, especialmente do Javascript pós-ES6. Hoje em dia a linguagem nos permite trabalhar com datas de forma mais completa e não precisando tanto de bibliotecas para solucionar alguns dos problemas que antes era complicado de se resolver ou demandavam maior tempo. 

O fato é que o Moment.JS foi muito útil nesses anos todos e nos ajudou a otimizar bastante o nosso tempo de desenvolvimento se tratando em lidar com datas no Javascript.   Mas beleza, não vamos ter atualizações dessa lib e com o tempo precisamos atualizar os projetos que utilizam ele. E como substituir então o Moment.JS para o `Date()`, `Intl` e outras propriedades de data do Vanilla JS? Logo abaixo cito algumas propriedades da lib e como convertê-las :)

**1. subtract()**

Com o Moment fazíamos muitas coisas, entre elas o `subtract()` que é subtrair as datas para tirar a diferença entre elas. Com o JS podemos substituir da seguinte forma: 

```
function subtractDay() { 
 const day = new Date(); 
 day.setDate(day.getDate() - 10); 
 return day; 
}
``` 

A função acima permite que a gente subtraia os dias em 10. Então o que ele faz é pegar a data atual, subtrair com o valor indicado e retornar a diferença. Então se hoje é dia 31/12 ele vai pegar e voltar 10 dias o que retornará o dia 21/12. 

Dica: Uma boa forma de vê-lo funcionando é copiando e colando esse código no console do seu browser e dar enter para ver o resultado :)   

**2. fromNow()**

Essa propriedade permitia que a gente trabalhe com o tempo relativo (1 dia atrás, 3 meses atrás e por aí vai) e com o JS podemos utilizar o `Intl.RelativeTimeFormat()`. Assim: 

```
function relativeDay() { 
 const rtf = new Intl.RelativeTimeFormat('br');
 const day = rtf.format(-1, 'day'); 
 return day; 
}
```
A função acima determina que a const `day` retorne o resultado "1 dia atrás" (repare na const `rtf` que adicionei um atributo de tradução "br" (Português Brasil). Caso queira mudar o idioma pasta colocar a sigla desejada :) 

**3. format()** 

Aqui você tem várias formas de substituir dependendo da sua necessidade. Usamos o `to..` para determinar o tipo de formatação. São elas: 

- **toString** retorna `Wed Dec 30 2020 23:39:35 GMT-0300 (Horário Padrão de Brasília)`
- **toDateString** retorna `Wed Dec 30 2020`
- **toLocaleString** retorna `30/12/2020 23:39:35`
- **toLocaleDateString** retorna `30/12/2020`
- **toGMTString** retorna `Thu, 31 Dec 2020 02:39:35 GMT`
- **toUTCString** retorna `Thu, 31 Dec 2020 02:39:35 GMT`
- **toISOString** retorna `2020-12-31T02:39:35.351Z`   

Exemplo de como utilizar uma dessas propriedades (vamos usar o `toLocaleString()`) : 

```
function formatDate() { 
 const date = new Date(); 
 const formatDate = date.toLocaleString(); 
 return formatDate; 
}  
``` 

A função acima retorna a data formatada `dd/mm/aaaa hh:mm:ss` e você pode formatar e customizar de acordo com o timezone ou idioma. Assim: 

```
function formatDate() { 
 const date = new Date(); 
 const formatDate = date.toLocaleString('en', { timeZone: 'UTC' }); 
 return formatDate; 
} 
``` 

Agora estamos determinando que a nossa função `formatDate()` retorne uma data formatada em inglês (AM/PM) e em UTC. 

Esses foram alguns exemplos de como trabalhar com datas no Javascript para substituir algumas propriedades do Moment.JS. Caso você ainda prefira trabalhar com libs uma outra alternativa seria utilizar o [date-fns](https://date-fns.org/).  

Até a próxima!