Como verificar se existem caracteres em Javascript

Olá pessoal! Uma validação muito comum utilizada em algum momento durante o desenvolvimento de projetos é a necessidade de verificar a existência de caracteres dentro de uma caixa de texto em um formulário, por exemplo. Essa confirmação é necessária quando temos um campo onde o usuário deve incluir somente números como em um CPF, um CEP ou telefone, por exemplo. O Javascript permite abordar esse problema de várias maneiras, como através do uso da função includes( ), que permite retornar um valor booleano conforme a condição de caracteres estabelecida, mas nem sempre isso resolve o nosso problema.

É aí que o isNaN( ) entra em ação!

Diferente, do includes( ), o isNaN( ) é uma função presente no Javascript que determina se um valor é ou não um NaN (Not a Number), ou seja, se o valor é ou não um número. Você pode conferir a documentação da função aqui. Esta função também pode ser útil para determinar outras situações, como por exemplo saber se um determinado valor é indefinido (undefined) ou mesmo para substituir os operadores de igualdade em uma expressão lógica. Mas, de modo geral, isNan( ) retornará false se o valor for numérico e true se não for numérico.

Um caso de uso

Considere o exemplo a seguir. Imagine que temos um formulário onde o usuário deve informar a altura do esterno em centímetros. Nesse caso, o usuário deve digitar somente números, que podem ser reais ou inteiros. Mas e se forem inseridos caracteres?

Fonte: Meu Bike Fit.

O código em Javascript seria algo mais ou menos assim:

const calcularAltura = (altura) => {

    if (esterno.length === 0) {     //Nenhum valor foi inserido.

        return alert('Erro! Campo em branco!');

    } else if (isNaN(esterno) {     //Existe(m) caractere(s)

        return alert('Erro! Formato inválido!');

    } else {

    return alert('A altura do esterno vale: ' + esterno + 'centímetros);

    }

}

Ao pressionar um botão, a função calcularAltura( ) seria executada. Caso seja inserido qualquer caractere na caixa de texto, como por exemplo se executarmos calcularAltura('112b'), a função retornará formato inválido, reduzindo a chance de surgirem erros:

Porém, para todos os valores numéricos, a condição será satisfeita e ele retornará o resultado correto:

isNaN( ) é uma função que, apesar de ser bastante simples, poderá ser muito útil no dia a dia, resolvendo problemas que o includes( ) poderá não ser capaz, ou não ser tão simples como na abordagem do isNan( ). E devido a sua natureza booleana, ela também poderá ser útil em casos contrários, onde desejamos que apenas caracteres sejam inseridos.

E é isso aí. Até mais!