• Categorias
    • Desenvolvimiento de software
    • Machine Learning & AI
    • Carreira de programador e dicas
    • Histórias de sucesso
  • Materiais Gratuitos
    • Calculadora CLT x PJ
    • Quiz de Front-end
    • Quiz de Mobile
    • Guia Full Stack atualizado
    • Guia de Negociação Salarial para Devs
    • Modelo de Currículo Internacional
  • Para Talentos
    • Criar perfil gratis
    • Ver vagas
  • Categorias
    • Desenvolvimiento de software
    • Machine Learning & AI
    • Carreira de programador e dicas
    • Histórias de sucesso
  • Materiais Gratuitos
    • Calculadora CLT x PJ
    • Quiz de Front-end
    • Quiz de Mobile
    • Guia Full Stack atualizado
    • Guia de Negociação Salarial para Devs
    • Modelo de Currículo Internacional
  • Para Talentos
    • Criar perfil gratis
    • Ver vagas

Início Como trabalhar com datas JavaScript usando MomentJS?

  • Foto de Geekhunter Geekhunter
  • janeiro 9, 2020
MomentJS para data JavaScript

Como trabalhar com datas JavaScript usando MomentJS?

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 😀

Foto de Geekhunter

Geekhunter

Python IDE
10 melhores IDEs e editores de código em Python para 2025
  • março 18, 2025
o que é commit
O que é Commit e como usar Commits Semânticos
  • dezembro 13, 2024
certificações em TI
10 certificações em TI muito valorizadas hoje
  • novembro 20, 2024
Consultor SAP: o que faz, salário e como se tornar um
  • março 20, 2025
brainfuck
Brainfuck: A linguagem esotérica que desafia programadores até hoje
  • junho 27, 2025
gerente de tecnologia
As principais habilidades de um gerente de tecnologia
  • junho 27, 2025
vagas de TI
Vagas de TI: como encontrar uma que combine com você?
  • junho 26, 2025
Planejamento da equipe de metodologia scrum
Metodologia Scrum: o básico que todo DEV precisa saber
  • junho 24, 2025

Gosta do conteúdo? Assine nossa Newsletter!

Desenvolvimiento de software

Brainfuck: A linguagem esotérica que desafia programadores até hoje

  • Geekhunter
  • junho 27, 2025
Carreira de programador e dicas

As principais habilidades de um gerente de tecnologia

  • Geekhunter
  • junho 27, 2025
Desenvolvimiento de software

Vagas de TI: como encontrar uma que combine com você?

  • GeekHunter
  • junho 26, 2025
Desenvolvimiento de software

Metodologia Scrum: o básico que todo DEV precisa saber

  • Geekhunter
  • junho 24, 2025
Carreira de programador e dicas

Dicas de carreira: como criar seu perfil profissional com foco na área tech

  • GeekHunter
  • junho 24, 2025
AnteriorAnteriorComo concluir um projeto de software de forma simples?
PróximoIonic vs React Native: Qual é o melhor para mim?Próximo

Rod. José Carlos Daux – SC
401, 4120 – km 4, Bairro Saco
Grande – Florianópolis – SC
CEP 88032-005

Para Profissionais
  • Criar Perfil
  • Vagas de tecnologia
  • Blog TI
  • Criar Perfil
  • Vagas de tecnologia
  • Blog TI
Para Empresas
  • Plataforma de Recrutamento Tech
  • Serviço de Recrutamento Tech
  • Nossos Planos
  • GeekAcademy
  • Blog de RHTech
  • Perguntas Frequentes
  • Login Empresas
  • Plataforma de Recrutamento Tech
  • Serviço de Recrutamento Tech
  • Nossos Planos
  • GeekAcademy
  • Blog de RHTech
  • Perguntas Frequentes
  • Login Empresas
A Geekhunter
  • Sobre a GeekHunter
  • Suporte
  • Políticas de Privacidade
  • Termos de Uso
  • Portal LGPD
  • Sobre a GeekHunter
  • Suporte
  • Políticas de Privacidade
  • Termos de Uso
  • Portal LGPD

Add Your Heading Text Here