1. Início
  2. Front-end
  3. Como trabalhar com datas JavaScript usando MomentJS?

Como trabalhar com datas JavaScript usando MomentJS?

MomentJS para data JavaScript

Como otimizar o desenvolvimento de seus projetos com datas no JavaScript? Usando MomentJS, claro!

Neste artigo, vou te mostrar o porquê do MomentJS, o plugin do momento, salvar muitos programadores! 😉

O que é MomentJS?

O MomentJS é uma biblioteca JavaScript muito poderosa, que fornece todo tipo de métodos e funções já prontinhas para lidar com o tempo em si.

Seja ele disposto de qualquer e toda forma possível, podendo ser usada a qualquer MOMENT.

Resumindo: pro MomentJS não tem tempo ruim!

Chegou o momento de falar de MomentJS que, brincadeiras à parte, só pelo nome já nos diz muita coisa sobre como ele funciona e o que, de fato, nos fornece de verdade.

Contextualização do MomentJS e o porquê de sua existência

Tá, agora pra contextualizar e justificar a existência desse plugin, vou ter que falar um pouco sobre JavaScript.

Desde os primórdios a linguagem sempre foi defasada no quesito data / tempo por ter suas diversas peculiaridades que levando para uma coisa tão global como o tempo, vinha por gerar seus problemas de compatibilidade e divergência.

Na prática!

Um exemplo bem comum é o JavaScript ser a única linguagem que implementa o mês a partir de 0 ao invés de 1.

Ou melhor dizendo, se você apertar F12 neste exato momento, assumindo que estamos em Janeiro, e ir na aba Console e colar este código, que serve pra pegar o mês atual que estamos:

new Date().getMonth()

Você verá o número zero sendo impresso no console, ao invés de 1, como seria o mais esperado.

Já que estamos no primeiro mês do ano, mais conhecido como mês um, certo?

Inicialmente, você pode achar que isso não é muita coisa.

Apesar que sim, tem como gerar vários problemas em relação a isso.

Eu te digo que, na verdade, não para por aí.

Tem outros problemas com os meios e formas que são disponibilizadas nativamente pela linguagem.

Como fazer operações com Data porque, de diversas maneiras, acaba por ser bem trabalhoso por não ter muita coisa pré-pronta e você acaba ter que reinventar a roda em muitos casos.

O que não é nada prático.

Eu acredito que o JavaScript tenha este problema por ter iniciado como uma linguagem apenas front-end.

Convenhamos que front-end nunca será um bom lugar para fazer operações com tempo e isso é uma verdade comum entre todos os bons desenvolvedores (creio eu).

Mas como hoje em dia com o Node.js ele se tornou back-end também, isso acaba por ser um problema mais grave.

Claro que a solução foi justamente a comunidade que solucionou.

Afinal, o JavaScript é uma linguagem sempre presente com o apoio muito forte da comunidade de desenvolvedores.

Eu também indico você procurar novas formas para concluir seu projeto de software sem dor de cabeça!

Agora vamos para o que mais te interessa: o código!

Vou usar como exemplo um caso comum.

Por exemplo, um aplicativo qualquer que poderia surgir para gerenciar os pontos de entrada e saída dos funcionários de uma empresa.

Digamos que neste aplicativo o funcionário tem um botão que, ao clicar, registra o instante em que ele entrou na empresa, como o primeiro ponto de entrada.

Temos o seguinte exemplo de código:

código usando o plugin moment

Agora, usamos a mesma operação para salvar o próximo ponto dele de saída para o almoço.

E, logo em seguida o de volta do almoço.

Mas queremos saber quanto tempo de intervalo o funcionário fez, como fazemos?

Temos o seguinte exemplo de código:

função para calcular os momentos da atividade
Usei a função .diff pra saber a diferença entre o momento do início e o momento do fim do intervalo em horas e em minutos

Basicamente usei a função .diff pra saber a diferença entre o momento do início e o momento do fim do intervalo em horas e em minutos também.

Agora, digamos que o funcionário quer saber que horas tem que permanecer no trabalho para totalizar 8 horas naquele dia.

Basicamente utilizei da função .diff para pegar a diferença que seria a subtração entre as duas datas.

Se você quiser saber o tempo de intervalo como antes e descobrir o momento que deve sair, deve somar as 8 horas da entrada e adicionar o tempo de intervalo, apenas isso.

Apenas com esse exemplo básico já dá pra saber um pouco do quanto ele salva os desenvolvedores e é uma mão na roda realmente.

Bônus!

Outro exemplo legal é aquilo que vemos no Facebook.

Por exemplo quando fazer um comentário e aparece “há poucos segundos” ou “há dois dias”.

Basicamente é uma função do MomentJS chamada moment().fromNow() que retorna todo o texto informando há quanto tempo foi o acontecimento informado.

E isso acontece já com a localização e o idioma que a pessoa escolheu para usar a rede social.

O mesmo serve pro moment().toNow() para saber quanto tempo falta para determinado evento acontecer.

Valeu a pena conhecer?

Se pararmos para pensar, o MomentJS é muito útil e está tão inserido no nosso dia a dia que mal percebemos.

Se quiser conhecer mais, você pode levar a documentação completa do MomentJS e o melhor, é open source!

Tenho certeza que esse plugin facilitará a sua vida e você vai ser cada vez mais um programador melhor!

Gostou? Deixa seu comentário! Aproveita para dar uma olhada nas nossas vagas de JavaScript!

Até a próxima 😀

Categorias

Leituras Recomendadas

Quer receber conteúdos incríveis como esses?

Assine nossa newsletter para ficar por dentro de todas as novidades do universo de TI e carreiras tech.