Validar uma data em JavaScript

Sahil Bhosale 12 outubro 2023
  1. Validar data com a biblioteca moment.js em JavaScript
  2. Validar data usando expressões regulares em JavaScript
  3. Validar a data com o método Date.parse() em JavaScript
Validar uma data em JavaScript

Validar uma data torna-se importante para validar datas em JavaScript porque várias pessoas em vários locais seguem formatos diferentes ao inserir datas. Temos que seguir um formato específico ao validar datas em nosso aplicativo da web para que mais tarde seja mais fácil para nós trabalharmos com a data.

Este artigo irá apresentar como validar a data no formato mm/dd/yy em JavaScript.

Validar data com a biblioteca moment.js em JavaScript

A biblioteca moment.js é a melhor e mais fácil maneira de validar e formatar datas e horas em JavaScript. Usaremos essa biblioteca para validar e exibir datas em JavaScript. Para usar esta biblioteca, primeiro temos que baixá-la usando o comando abaixo.

npm install -g moment --save 

Ele irá instalar um momento em seu sistema. Então podemos usar diretamente o método moment() disponível na biblioteca moment.js. Abaixo está o código para validar uma data com moment.js em JavaScript.

import * as moment from 'moment';

let result = moment('05/22/12', 'MM/DD/YY', true).isValid();
console.log(result)

Resultado:

true

A função momento recebe três parâmetros como entrada; o primeiro é a data de entrada que queremos validar, o segundo é o formato que queremos que nossa data siga, e o último parâmetro é opcional; se for definido como true, ele usará a análise estrita. A análise estrita requer que o formato e a entrada correspondam exatamente, incluindo delimitadores. Por fim, usamos a função isValid() para verificar se a data de entrada é válida ou não e retorna um valor booleano de true se a data de entrada corresponde ao formato dd/mm/yy e false se a data de entrada não corresponde ao formato especificado.

Validar data usando expressões regulares em JavaScript

Expressão regular é uma ótima maneira de validar a data. O único problema que muitas pessoas enfrentam quando se trata de expressões regulares é a dificuldade em entendê-las, pois contêm vários símbolos e números. Cada símbolo ou expressão em uma expressão regular tem seu próprio significado. Usando essas expressões, podemos validar a data no formato dd/mm/yyy em JavaScript.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Document</title>
  </head>
  <body>
    <h1 id="message"></h1>
    <script>
      
      var date_regex = /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(0[1-9]|1[1-9]|2[1-9])$/;
        var testDate = "03/17/21"
        if (date_regex.test(testDate)) {
            document.getElementById("message").innerHTML = "Date follows dd/mm/yy format";
        }
        else{
          document.getElementById("message").innerHTML = "Invalid date format";
        }

    </script>
  </body>
</html>

Saída no navegador:

Date follows dd/mm/yy format

A expressão regular /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(0[1-9]|1[1-9]|2[1-9])$/tem 3 grupos. O primeiro grupo representa mês, o segundo grupo representa dia e o terceiro grupo representa os últimos 2 dígitos do ano. Onde quer que você veja a barra /, ela representa o início do grupo, e a barra invertida \ representa o final do grupo.

Há 12 meses em um ano. Para que haja duas possibilidades ao selecionar um mês, pode começar com 0 seguido de um número ou com 1 seguido do número 1 ou 2. O mesmo processo é semelhante para outros grupos. O \d no segundo grupo representa qualquer dígito entre 0 a 9. Você também pode criar suas expressões regulares para validar datas.

Em seguida, armazenamos essa expressão regular na variável date_regex. Usaremos a data que está armazenada em myDate para verificar se a data segue o formato dd/mm/yy ou não. Se a data seguir este formato, imprimiremos o Date follows dd/mm/yy format dentro do console; caso contrário, imprimiremos Invalid date format.

Validar a data com o método Date.parse() em JavaScript

O Data.parse() é um método que já está disponível em JavaScript. Este método leva apenas uma data como um único parâmetro que é uma string.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Document</title>
  </head>
  <body>
    <h1 id="message"></h1>

    <script>
        let isValidDate = Date.parse('03/17/21');

        if (isNaN(isValidDate)) {
          document.getElementById('message').innerHTML = "This is not a valid date format.";
        }
        else{
          document.getElementById('message').innerHTML = "This is a valid date format.";
        }

    </script>
  </body>
</html>

Saída no navegador:

This is a valid date format.

A função Data.parse() retornará um número em milissegundos com base na data de entrada fornecida. Se não reconhecer a data de entrada, ele retornará NaN (não um número) como uma saída. O resultado desta função é armazenado dentro da variável isValidDate.

Se o valor dentro da variável isValidDate for NaN (não um número), ele retornará false e a mensagem que será impressa na tela será This is not a valid date format.. Se retornar true, ele imprimirá a mensagem This is a valid date format. na tela como a saída.

Sahil Bhosale avatar Sahil Bhosale avatar

Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.

LinkedIn

Artigo relacionado - JavaScript DateTime