Neste post mostro como verificar se uma string é um número e algumas formas de converter estas variaveis para números utilizando apenas Javascript puro.
Verificando
Então, para fazer esta verificação, você pode utilizar a função isNaN, que verifica se uma string é “Not a Number” (não é número). Logo, se ela retornar falso, estamos falando trabalhando com um número no formato string.
Como o Javascript é um ser temperamental e estranho, vamos ver alguns exemplos:
isNaN("42")
false
isNaN("42.99")
false
isNaN(".99")
false
isNaN("42,99")
true
isNaN("1e10000") //Representação de "Infinito"
false
Nos testes acima, quando a função isNaN retornou false, isso indica que a variável é um número. Note que a função não reconheceu a string “42,99” como um número, o que era esperado. Para tratar números com dígitos separados por vírgula, você vai precisar fazer um tratamento especial.
isNaN("10px")
true
isNaN("42pt")
true
isNaN("bacon")
true
Nesta segunda bateria de testes, nenhum dos valores foi reconhecido como um número.
Sendo assim, poderíamos criar a seguinte função para ver se uma string é um número:
function isNumber(str) {
return !isNaN(str)
}
O código acima vai inverter o resultado da função isNaN, o que nos da o resultado de forma amigável.
Convertendo
A primeira for a de converter é adicionando um sinal de adição na frente da variável (ou do valor). Todavia, isso só vai funcionar se a variável possuir apenas números.
Exemplos:
foo = +"42" 42 foo = +"42.99" 42.99 foo = +"42,99" NaN foo = +".99" 0.99 foo = +"" 0
Todos os testes acima deram certo, ou seja, as strings foram convertidas em números. Exceto pelo valor separado por vírgula. Note que, desta forma, uma string vazia pode ser convertida para o número zero.
foo = +"42px" NaN foo = +"42pt" NaN foo = +"foo" NaN
Novamente, nesta segunda bateria de testes, todos falharam.
Outra forma de fazer a conversão é utilizando a função parseInt mas, como o proprio nome sugere, ela converte strings apenas para integers, mas ela tem algumas vantagens.
Exemplos:
parseInt("42")
42
parseInt("42.99")
42
parseInt(".99")
NaN
parseInt("0.99")
0
parseInt("")
NaN
Nos testes acima, o único falhou foi a string “.99”, pois estamos convertendo a string para integer e esta função não consegue ‘entender’ que .99 == 0.99.
Outro ponto desta função é que, diferente de usar o sinal de adição, esta função não consegue converter uma string vazia para zero.
parseInt("42px")
42
parseInt("42pt")
42
parseInt("bacon")
NaN
Diferente das tentativas anteriores, esta bateria de teste obteve alguns sucessos. Esta função consegue extrair o número da string, dependendo do formato dela.
Existe também a função parseFloat, que resolve o problema de converter strings apenas para integers.
parseFloat("42")
42
parseFloat("42.99")
42.99
parseFloat(".99")
0.99
parseFloat("0.99")
0.99
parseFloat("42pt")
42
parseFloat("42px")
42
parseFloat("")
NaN
parseFloat("bacon")
NaN
Com estes testes, verificamos que o comportamento da parseFloat é bem similar ao do parseInt, com a diferença que ela consegue converter strings tipo “.99” para número.
Extra
A função que fizemos acima (isNumber) consegue verificar se uma string é um número, mas não consegue reconhecer “42px” como número. Se você quiser que variáveis como esta sejam reconhecidas como número, podemos alterar a função acima para a seguinte forma:
function isNumber(str) {
return !isNaN(parseFloat(str))
}
Com esta modificação, você vai conseguir flexibilizar o processo de reconhecer se uma string é ou não um número.
Espero ter ajudado!
Referências:
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isNaN
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat
Latest posts by Breno RdV (see all)
- O que é Metaclass e como ela funciona. (#python #dev #metaclass) - janeiro 11, 2023
- Entenda a mágica dos Generators. (#python, #dev, #generator, #iterator) - dezembro 28, 2022
- Ordenando um DataFrame por múltiplas colunas. (#python #pandas #jupyter #dev #data) - agosto 3, 2022