Convertir una cadena a número en JavaScript: guía completa para principiantes

Introducción: ¿por qué es importante?

Imagina la situación: estás escribiendo una calculadora de propinas en JavaScript. El usuario ingresa el monto de la cuenta en un campo de entrada, presiona un botón y obtiene... undefined o, peor aún, la cadena "10010" en lugar del número 110. ¿Te suena familiar? Si apenas estás comenzando tu camino en la programación, el problema de convertir una cadena a número en JavaScript es uno de esos "rastrillos" en los que todos tropiezan absolutamente.

En Stack Overflow, la pregunta "How can I convert a string to an integer in JavaScript?" ha acumulado miles de visitas y cientos de respuestas. Esto significa que incluso los desarrolladores experimentados a veces se confunden con los matices. Hoy vamos a aclarar de una vez por todas cómo convertir correctamente una cadena a número en JavaScript, qué métodos funcionan, cuáles no, y por qué a veces el resultado es inesperado.

¿Listo? ¡Entonces vamos allá!

¿Por qué convertir una cadena a número?

JavaScript es un lenguaje de tipado dinámico. Esto es genial porque no tienes que pensar en los tipos de datos… hasta que te encuentras con un error. El problema es que los datos de prompt(), campos de formulario input, parámetros de URL o API siempre llegan como cadenas. Incluso si el usuario ingresó "42", JavaScript no ve un número, sino un conjunto de caracteres.

Intenta sumar dos cadenas:

let a = "10";let b = "20";console.log(a + b); // "1020"

¿Ves? En lugar de la suma 30, obtuviste una concatenación. Para evitar esto, debes indicarle explícitamente a JavaScript: "Oye, estos son números, ¡trátalos como números!".

Método n.º 1: parseInt() — el clásico

La forma más popular de convertir una cadena a un número entero en JavaScript es la función parseInt(). Toma una cadena y "extrae" el número entero, ignorando todo lo que viene después de los dígitos.

Sintaxis y ejemplos

let str = "42";let num = parseInt(str);console.log(num); // 42 (número)

// Funciona incluso con "basura" después de los dígitosconsole.log(parseInt("123px"));    // 123console.log(parseInt("10.99"));    // 10 (descarta la parte decimal)

// Pero si la cadena no comienza con un dígito...console.log(parseInt("abc123"));   // NaNconsole.log(parseInt("  7"));      // 7 (los espacios al inicio se ignoran)

Importante: parseInt() se detiene en el primer carácter no numérico. Si la cadena comienza con una letra, obtendrás NaN (Not a Number).

Segundo argumento — sistema numérico

Pocos lo saben, pero parseInt() tiene un segundo parámetro: radix (base del sistema numérico). Esto evita errores con números octales:

// Sin radix puede haber confusiónconsole.log(parseInt("010")); // 10 (en IE antiguo podía ser 8)

// Siempre especifica 10 para el sistema decimalconsole.log(parseInt("010", 10)); // 10console.log(parseInt("FF", 16));  // 255 (hexadecimal)

Consejo de profesional: siempre pasa el segundo argumento 10 si trabajas con números decimales. Esto hace que el código sea más claro y seguro.

Método n.º 2: Number() — estricto pero honesto

La función Number() es una forma más estricta de convertir una cadena a número en JavaScript. A diferencia de parseInt(), no tolera ningún carácter extraño.

console.log(Number("42"));     // 42console.log(Number("10.99"));  // 10.99 (conserva la parte decimal)console.log(Number("123px"));  // NaN (la cadena contiene caracteres adicionales)console.log(Number(""));       // 0 (cadena vacía = 0)console.log(Number(" "));      // 0

Cuándo usarlo: si estás 100% seguro de que la cadena contiene solo un número (por ejemplo, después de la validación de un formulario). Para la entrada del usuario, es mejor parseInt() o