Conversiones numéricas

Que Javascript no sea un lenguaje fuertemente tipado y no tengamos que declarar obligatoriamente su tipo de dato, no significa que tengamos que despreocuparnos de ello. En muchas ocasiones, tendremos variables que nos interesa convertir a número por muchos motivos (realizar operaciones posteriormente, convertirlas a otra base numérica, etc...).

Veamos los detalles de estas conversiones y que métodos vamos a utilizar.

Convertir texto a número

Números enteros

Para convertir un string en number en Javascript, lo ideal es utilizar las funciones de parseo numérico, .parseInt() y .parseFloat(), que aunque son sencillas, tienen algunos detalles que deberíamos mencionar:

Método	Descripción
`Number.parseInt(text)`	Convierte un `text` en un entero.
`Number.parseInt(text, radix)`	Idem, pero el tiene un número en base `radix`.

Para ilustrar esto, veamos un ejemplo con el método .parseInt() cuando sólo le pasamos un parámetro (texto) que queremos convertir a número:

Number.parseInt("42");      // 42
Number.parseInt("42€");     // 42 (descarta todo desde un carácter no numérico)
Number.parseInt("Núm. 42"); // NaN (empieza a descartar en Núm, descarta también 42)
Number.parseInt("A");       // NaN (No se puede representar como un número)
Number.parseInt("");        // NaN (No se puede representar como un número)

Nota que el método .parseInt() funciona perfectamente para variables de texto que son números (o que empiezan por números). Esto es muy útil para eliminar unidades de variables de texto que se extraen de una página. Sin embargo, si la variable de texto comienza por un valor que no es numérico, .parseInt() descartará todo el texto y devolverá un NaN.

Si lo que queremos es quedarnos con un número que aparece posteriormente en la variable de texto, habrá que manipular ese texto con alguna de las funciones que veremos en el apartado de variables de texto.

Observa también que si utilizamos .parseInt() con un que contiene números decimales, sólo se quedará con la parte entera, descartando el resto del número:

Number.parseInt("42.5");      // 42 (descarta los decimales)
Number.parseInt("88.99€");    // 88 (descarta decimales y resto de caracteres)
Number.parseInt("Núm. 33.5"); // NaN (empieza a descartar en Núm, descarta todo)

Si queremos quedarnos con el número decimal completo, necesitamos el método que explicamos en el siguiente apartado.

Números decimales

De forma análoga a .parseInt() tenemos otro método llamado .parseFloat(). Funciona exactamente igual a la primera, sólo que está enfocada para trabajar con números decimales, en lugar de números enteros. Si utilizamos .parseInt() con un número decimal, nos quedaremos sólo con la parte entera, mientras que con .parseFloat() conservará también la parte decimal (si la tiene).

Método	Descripción
`Number.parseFloat(text)`	Convierte un `text` en un decimal.
`Number.parseFloat(text, radix)`	Idem, pero el tiene un número en base `radix`.

Veamos unos ejemplos utilizados con .parseFloat():

Number.parseFloat("42.5");      // 42.5 (Conserva decimales)
Number.parseFloat("42");        // 42 (El número es entero, convierte a entero)
Number.parseFloat("88.99€");    // 88.99 (Conserva decimales)
Number.parseFloat("42€");       // 42 (El número es entero, convierte a entero)
Number.parseFloat("Núm. 33.5"); // NaN (empieza a descartar en Núm, descarta todo)

Recuerda utilizar .parseFloat() siempre que necesites mantener los decimales.

Convertir desde otra base

Habrás observado que tanto .parseInt() como .parseFloat() tienen un segundo parámetro radix. Este parámetro sirve para indicar la base numérica desde la que procede el número del . Por defecto, cuando se omite este parámetro, se asume que la base es 10 (base decimal), pero indicando este parámetro podemos cambiar la base.

¿Qué es una base numérica?

Los humanos solemos utilizar una base numérica decimal, es decir, contamos desde el 0 al 9, es decir, 10 números. Sin embargo, existen otras bases numéricas:

// Base binaria: 0, 1 (Base 2)
// Base octal: 0, 1, 2, 3, 4, 5, 6, 7 (Base 8)
// Base decimal: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 (Base 10)
// Base hexadecimal: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F (Base 16)

Convertir a decimal

Así pues, podemos convertir de cualquier base numérica a la decimal, utilizando el parámetro radix de estos métodos:

Number.parseInt("11101", 2);    // 11101 en binario, es 29 en decimal
Number.parseInt("31", 8);       // 31 en octal, es 25 en decimal
Number.parseInt("FF", 16);      // FF en hexadecimal, es 255 en decimal

Otra forma de representar estos números en una base numérica específica en Javascript es utilizando la nomenclatura de la base numérica mediante un prefijo 0b, 0o o 0x. Al utilizarlos, se convertirán automáticamente a base decimal:

0b11101;   // 29
0o31;      // 25
0xFF;      // 255

Convertir desde decimal

También nos podría interesar hacer la operación inversa. Es decir, tenemos un número en base decimal y queremos convertirlo a una base numérica diferente. Para ello, lo ideal es utilizar el método .toString() de los :

Método	Descripción
`Number.toString()`	Convierte un en .
`Number.toString(radix)`	Convierte un a la base `radix` y lo devuelve como texto.

Vamos a realizar varias operaciones de ejemplo para ejemplificar su utilización:

(16).toString();        // "16"     (lo convierte a string)
(42.5).toString();      // "42.5"   (lo convierte a string)
(26).toString(2);       // "11010"  (26 en decimal, es 11010 en binario)
(80).toString(8);       // "120"    (80 en decimal, es 120 en octal)
(245123).toString(16);  // "3bd83"  (245123 en decimal, es 3bd83 en hexadecimal)