Convertir un string a numero en JavaScript
La conversion de cadenas a valores numericos es una operacion cotidiana en el desarrollo con JavaScript. Los datos procedentes de formularios, parametros de URL, respuestas de API o archivos de configuracion llegan habitualmente como texto, incluso cuando representan cantidades, identificadores o medidas. Sin una conversion explicita y controlada, las operaciones aritmeticas pueden producir resultados inesperados debido a la coercion de tipos del lenguaje. Dominar las distintas tecnicas disponibles permite elegir el metodo adecuado segun el formato de entrada y los requisitos de validacion.
JavaScript dispone de varias funciones y operadores para realizar esta transformacion. Cada uno presenta diferencias sutiles en el tratamiento de espacios en blanco, caracteres no numericos, notacion cientifica y bases distintas de la decimal. Comprender estas diferencias evita errores silenciosos que pueden propagarse en calculos posteriores o en la logica de negocio. En aplicaciones modernas, donde los datos de usuario se procesan tanto en el cliente como en el servidor, la consistencia en la conversion contribuye a la fiabilidad del sistema.
A lo largo de esta guia se examinan los metodos principales, sus comportamientos ante casos limite y las practicas recomendadas para integrarlos de forma segura en el codigo. Se incluyen ejemplos que ilustran tanto las conversiones exitosas como las situaciones en las que el resultado es NaN o un valor por defecto no deseado.
Usando Number
La funcion Number convierte su argumento a un valor numerico primitivo. Cuando recibe una cadena, intenta interpretar la totalidad del contenido como un numero. Si la cadena representa un entero o un decimal valido, incluyendo notacion cientifica, la conversion tiene exito. En caso contrario, el resultado es NaN.
const cadena = "123.45";
const numero = Number(cadena);
console.log(numero); // 123.45
console.log(typeof numero); // "number"
Number es estricta con el contenido de la cadena. Cualquier caracter no numerico, incluso despues de un prefijo valido, produce NaN. Esta conducta resulta util cuando se espera que la entrada completa sea un numero limpio, como ocurre con valores de formularios que han sido validados previamente. Los espacios en blanco iniciales y finales se ignoran, pero una cadena vacia se convierte en cero, lo que puede introducir errores si no se comprueba de forma explicita.
La funcion tambien acepta otros tipos. Los valores booleanos se convierten a 1 y 0, null se convierte a 0 y undefined produce NaN. Cuando se trabaja exclusivamente con cadenas, estas conversiones adicionales rara vez intervienen, pero es conveniente conocerlas para evitar sorpresas al procesar datos de origen mixto.
Usando parseInt
La funcion parseInt analiza una cadena y devuelve un entero. A diferencia de Number, parseInt lee caracteres desde el inicio hasta encontrar un caracter que no pertenezca a la base indicada y descarta el resto. Esta tolerancia permite extraer numeros de cadenas que contienen unidades o texto adicional, como “42px” o “100abc”.
El segundo argumento, denominado radix, especifica la base numerica. Se recomienda proporcionarlo siempre, incluso cuando se trabaja en base decimal, para evitar interpretaciones dependientes del entorno en versiones antiguas del lenguaje. El valor de la base debe estar comprendido entre 2 y 36.
const hexadecimal = "1A";
const decimal = parseInt(hexadecimal, 16);
console.log(decimal); // 26
const binario = "1010";
const resultado = parseInt(binario, 2);
console.log(resultado); // 10
Si la cadena no comienza con un caracter valido para la base, parseInt devuelve NaN. Los espacios iniciales se ignoran. Cuando se omite la base y la cadena comienza con “0x”, la funcion puede interpretar el valor como hexadecimal en algunos contextos, aunque la practica recomendada es indicar la base de forma explicita.
parseInt trunca la parte decimal. La cadena “10.9” produce el entero 10. Esta conducta es adecuada cuando se necesita un numero entero y se desea descartar cualquier fraccion, pero puede resultar inesperada si el objetivo es preservar la precision decimal.
Usando parseFloat
parseFloat convierte una cadena en un numero de punto flotante. Al igual que parseInt, lee desde el inicio y se detiene ante el primer caracter no valido para un numero decimal. Acepta el punto como separador decimal y reconoce la notacion cientifica.
const decimal = "10.5";
const numero = parseFloat(decimal);
console.log(numero); // 10.5
const cientifico = "1.5e3";
console.log(parseFloat(cientifico)); // 1500
parseFloat no acepta un argumento de base; siempre opera en base diez. Resulta la opcion preferida cuando la entrada puede contener decimales y se desea conservar la parte fraccionaria. Al igual que parseInt, tolera texto posterior al numero, lo que la hace util para procesar valores con unidades.
Si la cadena no contiene un numero valido al inicio, el resultado es NaN. Una cadena vacia o compuesta solo por espacios tambien produce NaN, a diferencia de Number, que convierte la cadena vacia en cero.
Usando el operador unario
El operador unario mas realiza una conversion a numero equivalente a la funcion Number. Su sintaxis concisa lo hace atractivo en expresiones cortas y en codigo que prioriza la brevedad. El comportamiento ante cadenas validas, invalidas y casos especiales es identico al de Number.
const cadena = "123";
const numero = +cadena;
console.log(numero); // 123
console.log(typeof numero); // "number"
Para valores hexadecimales, el operador unario requiere el prefijo “0x” para interpretar correctamente la base. Sin ese prefijo, una cadena como “1A” produce NaN.
const hex = "1A";
const decimal = +("0x" + hex);
console.log(decimal); // 26
El operador unario es eficiente y ampliamente utilizado en codigo moderno. Sin embargo, su naturaleza implicita puede reducir la legibilidad para desarrolladores que no estan familiarizados con esta convencion. En equipos que priorizan la claridad, la funcion Number suele preferirse por expresar de forma explicita la intencion de conversion.
Ejemplos practicos de conversion
En el procesamiento de datos de formularios es frecuente recibir valores como cadenas. La siguiente funcion ilustra una conversion segura que valida el resultado antes de utilizarlo en un calculo.
function convertirYSumar(a, b) {
const numA = Number(a);
const numB = Number(b);
if (Number.isNaN(numA) || Number.isNaN(numB)) {
throw new Error("Entrada no numerica");
}
return numA + numB;
}
Cuando se procesan estilos CSS o atributos que incluyen unidades, parseFloat o parseInt permiten extraer el valor numerico sin necesidad de limpiar la cadena previamente.
const ancho = "250px";
const valor = parseFloat(ancho);
console.log(valor); // 250
En la lectura de archivos de configuracion o de parametros de linea de comandos, la combinacion de validacion con expresion regular y conversion explicita reduce el riesgo de aceptar entradas mal formadas.
Consideraciones importantes en la conversion
El valor NaN representa el resultado de una conversion fallida. Cualquier operacion aritmetica que involucre NaN produce NaN, lo que puede propagar errores de forma silenciosa. La funcion Number.isNaN permite detectar este caso de manera fiable, a diferencia del operador isNaN global, que realiza una coercion previa.
const valor = "texto";
const numero = Number(valor);
if (Number.isNaN(numero)) {
console.error("Conversion fallida");
}
Ciertos valores se consideran falsy en contextos booleanos. La cadena vacia, al convertirse con Number o con el operador unario, produce cero. Este comportamiento puede alterar la logica de una aplicacion si un campo opcional se interpreta como un valor numerico cero en lugar de como ausencia de dato. La comprobacion explicita de la cadena antes de la conversion evita esta ambiguedad.
function convertirSeguro(cadena) {
if (cadena.trim() === "") {
return null;
}
const numero = Number(cadena);
return Number.isNaN(numero) ? null : numero;
}
Otros tipos de datos tambien pueden convertirse. Los booleanos producen 1 y 0, y los objetos que implementan un metodo valueOf o toString que devuelve una representacion numerica pueden convertirse correctamente. En la practica, cuando se procesan datos de usuario, es preferible asegurarse de que la entrada es una cadena antes de aplicar la conversion.
Tecnicas avanzadas y buenas practicas
La validacion previa mediante expresiones regulares permite rechazar cadenas que no cumplen un formato numerico esperado. Una expresion sencilla puede verificar la presencia de un signo opcional, digitos y un punto decimal opcional.
function esNumeroValido(cadena) {
return /^-?\d+(\.\d+)?$/.test(cadena.trim());
}
const entrada = "123.45";
if (esNumeroValido(entrada)) {
const numero = Number(entrada);
console.log(numero);
}
Cuando se trabaja con bases distintas de la decimal, parseInt con el argumento de radix es la opcion correcta. Olvidar especificar la base puede producir resultados incorrectos en cadenas que comienzan con cero.
La preferencia por conversiones explicitas mejora la legibilidad y facilita la deteccion de errores. Aunque JavaScript permite operaciones que realizan coercion implicita, como la suma de una cadena y un numero, el resultado puede ser una concatenacion en lugar de una suma aritmetica. Convertir ambos operandos de forma explicita elimina esta ambiguedad.
En entornos donde se manejan enteros de gran magnitud que exceden el rango seguro de Number, el tipo BigInt ofrece una alternativa. La conversion desde cadena se realiza con el constructor BigInt o con el sufijo n en literales. Esta opcion es relevante en aplicaciones financieras o criptograficas, aunque requiere atencion especial porque BigInt no se mezcla directamente con Number en operaciones aritmeticas.
La eleccion del metodo depende del contexto. Number o el operador unario son adecuados cuando se espera una cadena completamente numerica. parseInt y parseFloat resultan utiles cuando se necesita extraer un numero de un texto que contiene caracteres adicionales. En todos los casos, la validacion del resultado y el manejo explicito de NaN constituyen practicas esenciales para mantener la robustez del codigo.
Conclusiones
La conversion de cadenas a numeros en JavaScript dispone de multiples herramientas, cada una con comportamientos especificos ante entradas validas, parciales o invalidas. Number y el operador unario realizan una conversion estricta de la cadena completa, mientras que parseInt y parseFloat permiten extraer valores numericos de textos mixtos y, en el caso de parseInt, trabajar con bases distintas de la decimal.
El manejo adecuado de NaN, la comprobacion de cadenas vacias y la validacion previa reducen el riesgo de errores silenciosos en calculos y en la logica de la aplicacion. La preferencia por conversiones explicitas y la especificacion de la base en parseInt contribuyen a un codigo mas claro y mantenible.
Dominar estas tecnicas permite procesar datos numericos procedentes de fuentes externas con confianza y precision. La aplicacion consistente de las practicas descritas garantiza que las conversiones se realicen de forma predecible y que los casos limite se traten de manera explicita, fortaleciendo la fiabilidad de las aplicaciones JavaScript.