Idioma: ES
LuisLlamas Logo
Buscar
⏲️ ~ 5 minutos Iniciación
coercion-y-conversion-de-variables-en-javascript

Coerción y conversión de variables en javaScript

En JavaScript la coerción (a veces llamada cast) es el proceso de convertir un valor tipo de datos en otro.

JavaScript es un lenguaje de tipado dinámico. Es decir, hace gran parte del trabajo de gestión de tipos por nosotros. Pero eso no significa que no tenga tipos (tiene, igual que todos los demás lenguajes de programación)

Además, JavaScript está concebido desde su principio para simplificar la gestión de tipos. Esto incluye la simplificación de la conversión de tipos.

De hecho, una de sus características es que en ocasiones intenta convertir las unidades “de más”, siendo muy “creativo”, y dando lugar a situaciones poco intuitivas por las que es criticado (¿injustamente?)

En cualquier caso, convertir entre tipos de datos es necesario en muchas ocasiones (y más aún entenderlas, porque como digo a veces JavaScript es creativo de más)

Existen dos tipos de coerción en JavaScript: la coerción explícita y la coerción implícita.

  • La coerción explícita ocurre cuando un convierte un tipo de dato en otro utilizando una función o una expresión
  • La coerción implícita ocurre cuando JavaScript convierte automáticamente un tipo de dato (sin que se le haya indicado explícitamente que lo haga)

Conversión implícita

La conversión implícita ocurre cuando JavaScript convierte un valor a otro tipo de dato automáticamente en función del contexto en el que se usa.

Este proceso se “dispara” automáticamente al realizar una operación (como utilizar una operador, o usar una estructura como un bucle o un condicional).

Conversor por operador

Operación aritmética

JavaScript convierte las cadenas en números cuando realiza operaciones aritméticas.

let resultado = '5' - 2; // '5' se convierte en el número 5
console.log(resultado); // Imprime: 3

En este caso, la cadena '5' se convierte en el número 5 antes de realizar la resta.

Operación de Concatenación

En la concatenación de cadenas y otros tipos, JavaScript convierte los valores a cadenas.

let saludo = 'El número es ' + 7; // 7 se convierte en la cadena '7'
console.log(saludo); // Imprime: El número es 7

Aquí, el número 7 se convierte en la cadena '7' para poder concatenarlo con 'El número es '.

Este da lugar a muchos errores poco intuitivos, porque + es tanto operador aritmético como comparación

Operación de comparación

Las comparaciones de igualdad (==) también pueden involucrar coerción implícita.

console.log(5 == '5'); // Imprime: true

En este ejemplo, JavaScript convierte la cadena '5' en el número 5 para comparar los dos valores.

Operadores lógicos

Los operadores lógicos (&&, ||) pueden realizar coerción implícita para convertir valores a booleanos.

console.log('' || 'Hola'); // Imprime: Hola

Aquí, la cadena vacía '' se convierte en false, y el operador || devuelve 'Hola'.

Conversión por función

La conversión a booleano se utiliza comúnmente en estructuras de control como if, while, y operadores lógicos. Los valores que se convierten a false son conocidos como valores falsy, mientras que todos los demás son truthy.

if ('texto') {
   console.log('Siempre verdadero'); // Se ejecuta
}

if (0) {
   console.log('Nunca verdadero'); // No se ejecuta
}

Eh… no hagáis eso, es una práctica malísima. Para eso existen los valores booleanos.

Conversión explícita

La conversión explícita es el proceso en que convertimos un valor a un tipo de dato específico utilizando funciones y métodos incorporados en JavaScript.

Conversión a número

Utiliza Number() para convertir una cadena a un número.

let numero = Number('123'); // Conversión explícita a número
console.log(numero); // Imprime: 123

También puedes usar parseInt() o parseFloat() para convertir cadenas a enteros o números flotantes, respectivamente.

let entero = parseInt('123', 10); // Convertir a entero
let flotante = parseFloat('123.45'); // Convertir a flotante

Conversión a cadena

Usa String() para convertir un número o cualquier otro valor a una cadena.

let cadena = String(123); // Conversión explícita a cadena
console.log(cadena); // Imprime: '123'

El método .toString() también puede ser utilizado para convertir números y otros tipos a cadenas.

let numero = 123;
let cadena = numero.toString(); // Conversión explícita a cadena
console.log(cadena); // Imprime: '123'

Conversión a booleano

Utiliza Boolean() para convertir un valor a un booleano.

let esVerdadero = Boolean(1); // Conversión a booleano
console.log(esVerdadero); // Imprime: true

Los valores que se convierten a false en JavaScript incluyen 0, NaN, null, undefined, y la cadena vacía ''.

Coerción de tipos primitivos

En JavaScript, los tipos primitivos incluyen string, number, boolean, null, undefined, y symbol. Cada uno de estos tipos tiene reglas específicas para la coerción.

Tipo de DatoConversión
a Number		Conversión
a String		Conversión
a Boolean
String ("123")123=true si no está vacío
String ("abc")NaN=true si no está vacío
Number (123)="123"true si es diferente de 0
Number (0)="0"false
Boolean (true)1"true"=
Boolean (false)0"false"=
null0"null"false
undefinedNaN"undefined"false

Conversión a Number

  • Las cadenas de texto que contienen números se convierten en esos números
  • Mientras que cadenas no numéricas resultan en NaN
  • true se convierte a 1
  • false y null a 0
  • undefined a NaN

Conversión a String

  • Todos los tipos pueden convertirse a una representación textual usando su valor (por ejemplo, true se convierte a "true", y null a "null")

Conversión a Boolean

  • Los valores “falsos” (0, false, null, undefined, NaN o una cadena vacía "") se convierten a false
  • Mientras que todo lo demás es true.

Cómo evitar errores de coerción consejos

La coerción puede llevar a errores sutiles y difíciles de depurar. Para evitar estos errores, es importante tener en cuenta los siguientes consejos:

Utiliza operadores estrictos de comparación (=== y !==) en lugar de operadores de comparación no estrictos (== y !=) para evitar la coerción automática de tipos.

Convierte los tipos de datos explícitamente utilizando funciones como Number(), String() y Boolean().

Asegúrate de que los tipos de datos sean los esperados antes de realizar una operación. Puedes usar la función typeof para verificar el tipo de dato de una variable.

const num = '10';
if (typeof num === 'number') {

En esta página