Converta uma string em uma data em JavaScript

  2. HowTo
  3. JavaScript Howtos
  4. Converta uma string em uma data em …
Nithin Krishnan 12 outubro 2023
JavaScript JavaScript String
  1. Use a função new Date() para converter string em data em JavaScript
  2. Use a função Date.parse() para converter string em data em JavaScript
  3. Dividir string e convertê-la em data em JavaScript
  4. Conclusão
Converta uma string em uma data em JavaScript

Às vezes, é necessário converter uma string em um formato de data. A string pode ser um valor de data armazenado como string no banco de dados ou um valor retornado da API. Em qualquer um dos casos, este valor de string não pode ser usado diretamente em selecionadores de data ou data do tipo de entrada. Portanto, a string precisará ser convertida em um objeto de data para ser exibida na IU HTML. Por estar em formato de string, não é possível realizar operações específicas para datas. Portanto, precisamos converter a string em um objeto de data. Aqui, listamos algumas maneiras de converter uma string em uma data:

  • new Date()
  • Date.parse()
  • Dividir e converter para data

Use a função new Date() para converter string em data em JavaScript

A maneira mais comumente usada para converter uma string em data é com a função new Date(). new Date() aceita argumentos em várias formas descritas abaixo, mas retorna um objeto de data.

  1. Sem parâmetros como argumento. new Date() retornará a data e hora atuais do sistema, incluindo as informações de fuso horário na hora do sistema local, se nenhum parâmetro for passado para a função new Date().
  2. Passando o objeto de data como o argumento. O new Date() retornará um objeto de data conforme representado pela string de data passada como um argumento.
  3. Passando uma data de string. A parte mais interessante da função new Date('2018-12-3') é que ela pode converter uma data passada em um formato de string como um argumento em um formato de data. Vamos discutir isso em detalhes.

Passando a data da string como um argumento

Quando passamos uma data em formato de string para a new Date(), ela é convertida em um objeto de data. O formato da string precisa ser YYYYY-MM-DD, o formato ISO 8601, para funcionar. Outros formatos de data não podem ser convertidos em um objeto de data por este método. Por exemplo, consulte o código da seguinte maneira:

new Date('2021-05-23');
new Date('2020/2/29');
new Date('2020-14-03');
new Date('14-02-2021');

Resultado:

Sun May 23 2021 05:30:00 GMT+0530 (India Standard Time)
Sat Feb 29 2020 00:00:00 GMT+0530 (India Standard Time)
Invalid Date
Invalid Date

Como você pode ver nos exemplos acima, o único formato de string aceito para a data é 2021-05-23 e 2020/2/29. A função new Date() pode processar strings no formato YYYY-MM-DD ou YYYYY/MM/DD. Se tivermos um formato de string diferente que não esteja em conformidade com os padrões ISO 8601, a new Date() não será capaz de analisar a data e retornará como uma data inválida.

Observações

  • new Date() pode ser usado para converter a string em uma data apenas se qualificar o formato ISO 8601 “YYYY-MM-DD hh: mm: ss”.
  • Para um formato diferente que não pode ser compreendido por new Date(), é melhor dividir a string e passá-los como argumentos em new Date(), conforme apresentado posteriormente neste artigo.
  • new Date() também pode converter uma string do formato 01 Mar 2020 12:30 ou mesmo MM DD YYYY HH:mm. Caso estejamos usando um valor passado do back-end via API para conversão, devemos ter certeza de que o formato passado é como entendido pela função new Date(), e é bom ter uma verificação de que new Date() retorna um objeto de data válido. Caso contrário, o código pode quebrar.

Use a função Date.parse() para converter string em data em JavaScript

Date.parse() é uma opção alternativa para converter a data da string. Ele retorna um valor numérico em vez de um objeto de data. Portanto, será necessário processamento adicional se você espera um objeto de data. Ele converte a data analisada em um número que representa os milissegundos que se passaram desde a meia-noite de 1 de janeiro de 1970. É semelhante ao formato de carimbo de data/hora, com a diferença de que, em vez de segundos, Date.parse() retorna um valor em milissegundos.

Date.parse('2020-11-21')
Date.parse('2019-01-01T12:30:00.000Z')
Date.parse('20-11-2021')
Date.parse('11-20-2021')

Resultado:

1605916800000
1546345800000
NaN
1637346600000

É importante notar que Date.parse() é o mesmo que new Date() no que diz respeito ao tipo de valores de entrada que pode aceitar, mas oferece uma melhor verificação manual se a data tem um formato válido. Esse método é útil, especialmente quando estamos lidando com um valor de resposta da API. Nesses casos, podemos precisar realizar uma verificação para garantir que o valor retornado pelo back-end está de acordo com o formato de data aceito pela função Date.parse() ou mesmo a função new Date(). Apenas uma verificação isNaN() pode ajudar a identificar e pousar com segurança no método de conversão de data.

let stringsFromAPI = ['2020-11-21', '20-11-2021'];

stringsFromAPI.forEach((d) => {
  if (!isNaN(Date.parse(d))) {
    console.log(new Date(d));
  }
})

Resultado:

Sat Nov 21 2020 05:30:00 GMT+0530 (India Standard Time)

Observe que aqui a data 20-11-2021 está no formato DD-MM-YYYY. Portanto, não será entendido pela função Date.parse() nem pela função new Date(). Portanto, se stringsFromAPI for um valor proveniente do backend, a função acima converterá apenas as datas que estiverem em conformidade com o formato aceitável. O !isNaN(Date.parse(d)) rejeita silenciosamente o valor de data impróprio e registra o valor que é bem-sucedido na conversão.

Observações

  • Date.parse() é semelhante a new Date() exceto pelo tipo de retorno, o que o torna adequado para verificar se um valor de data está em um formato correto e também pode ser usado para atribuir uma data usando o dateObj.setTime(Date.parse(DateString)).
  • Comparado com o Unix Time Stamp, o Date.parse() retorna milissegundos que podem ser usados ​​para comparação precisa de datas, mesmo sem convertê-los em objetos de data reais com new Date().
  • Date.parse() usa internamente a new Date() para analisar a data, portanto, os formatos aceitos pela função new Date() também serão suportados na função Date.parse().

Dividir string e convertê-la em data em JavaScript

Ambas as funções Date.parse() e new Date() são projetadas com base no formato de data estendida ISO 8601. Às vezes, se a data não estiver de acordo com o formato esperado, teremos que resolver isso manualmente dividindo a string de data, extraindo os valores e convertendo-os em um objeto de data. Surpreendentemente, o new Date() também suporta que os parâmetros de data sejam passados ​​como argumentos, e obtemos o objeto de data como saída.

A sintaxe para criar uma data a partir de argumentos:

new Date(yearValue, IndexOfMonth, dayValue, hours, minutes, seconds)

Onde,

  • yearValue: Deve estar de acordo com o formato ISO 8061 YYYY. Por exemplo, 2021. Se especificarmos um valor no formato YY, ele será interpretado incorretamente. Por exemplo, apenas mencionar 21 para 2021 será considerado 1921 em vez de 2021.
  • IndexOfMonth: Começa com o índice 0. Portanto, subtraia 1 do valor do Mês. Por exemplo, para março, o valor é 3, mas monthIndex será 2 (ou seja, 3-1 = 2). O índice do mês normalmente deve estar na faixa de 0-11
  • dayValue: Indica o dia do mês. Ele deve estar no intervalo de 1 a 31, dependendo do número de dias em um mês. Por exemplo: para 21-05-2021, o valor do dia é 21
  • hours: a hora do dia. Por exemplo, 10 horas.
  • minutes: Os minutos depois de uma hora.
  • seconds: retém o valor dos segundos após um minuto.

A seguir está uma função que pega uma string com um formato de data personalizado - DD-MM-YYYYTHH:mm:SS e retorna um objeto de data.

function convertFromStringToDate(responseDate) {
  let dateComponents = responseDate.split('T');
  let datePieces = dateComponents[0].split('-');
  let timePieces = dateComponents[1].split(':');
  return (new Date(
      datePieces[2], (datePieces[1] - 1), datePieces[0], timePieces[0],
      timePieces[1], timePieces[2]))
}

convertFromStringToDate('21-03-2020T11:20:30')

Resultado:

Sat Mar 21 2020 11:20:30 GMT+0530 (India Standard Time)

Conclusão

A função new Date() mais comumente usada é muito útil para converter uma data de string em um objeto de data, desde que a string esteja em conformidade com o formato ISO 8601. Em comparação com new Date(), a função Date.parse() difere de forma que retorna um valor numérico contendo os milissegundos desde primeiro de janeiro de 1970 que decorreram até a data passada como um argumento de string. Um formato de data diferente pode ser convertido dividindo a string de data e passando os componentes de data como argumentos para a função new Date().

Artigo relacionado - JavaScript String