Cargando...

Conversión de tipos

Ya separas null y undefined. Lo siguiente: cambiar a propósito el tipo de un valor — número a texto para una etiqueta, texto a número para calcular. Eso es conversión de tipos. Aquí usamos ayudantes claros: String(), Number() y Boolean() — más una sorpresa habitual con +.

¿Qué es la conversión de tipos en JavaScript?

Conversión de tipos significa pasar un valor de un tipo a otro. Mejor explícita: String(42) da "42", Number("7") da 7, Boolean(0) da false. Si Number no entiende el texto, obtienes NaN. Con +, si hay una cadena, a menudo concatena en lugar de sumar — regístralo una vez para que quede.

Kit de conversión

📊 Conversión de tipos para principiantes

Ayuda / idea Ejemplo Resultado / nota
String(...) String(42) "42" (texto)
Number(...) Number("7") 7 (número)
Boolean(...) Boolean(0) false (vista previa falsy)
Texto no numérico Number("hello") NaN — typeof sigue "number"
Vacío → booleano Boolean("") false
Mezcla con + 5 + "2" "52" (concatena, no 7)

String() — crear texto

Cuando necesites etiqueta o mensaje, envuelve el valor en String(...). Números, booleanos, null y undefined pasan a cadena para mostrar o unir.

conversiones con String()

javascript
console.log(String(42));
console.log(String(true));
console.log(String(null));
console.log(String(undefined));
console.log(typeof String(42));

Number() — crear un número

Usa Number(...) cuando el texto debe servir para matemáticas. Cadenas de dígitos convierten bien. Texto no numérico se vuelve NaN.

conversiones con Number()

javascript
console.log(Number("7"));
console.log(Number("3.5"));
console.log(Number(true));
console.log(Number(false));
console.log(typeof Number("7"));

Cuando Number falla — NaN

Number("hello") es NaN. Del tema de números: typeof NaN sigue siendo "number". Trata NaN como conversión fallida, no como cantidad usable.

trampa Number se vuelve NaN

javascript
console.log(Number("hello"));
console.log(typeof Number("hello"));
console.log(Number(""));
console.log(Number(null));

Number("") y Number(null) dan 0 — otra trampa para principiantes. Si quieres una cantidad real, usa cadenas de dígitos claras.

Boolean() — sí/no desde un valor

Boolean(...) convierte a true o false. Vacíos como 0, "", null, undefined y NaN dan false. Cadenas no vacías y la mayoría de números dan true. La lista completa truthy / falsy viene después — aquí basta el ayudante.

conversiones con Boolean()

javascript
console.log(Boolean(1));
console.log(Boolean(0));
console.log(Boolean("hi"));
console.log(Boolean(""));
console.log(Boolean(null));

La sorpresa de + — concatenar vs sumar

Si un lado de + es cadena, JavaScript suele unir texto en lugar de sumar. Cuando quieras matemáticas, convierte antes con Number().

el más puede concatenar

javascript
console.log(5 + 2);
console.log(5 + "2");
console.log(Number("5") + Number("2"));
console.log("Score: " + 10);

Mostrar conversiones en la página

Convierte unos valores y escribe etiquetas cortas con textContent.

Etiquetas de página tras conversión

html
<!DOCTYPE html>
<html>
<head>
<title>Type conversion — labels</title>
</head>
<body>
<p id="out">…</p>
<script>
let raw = "12";
let asNumber = Number(raw);
let asText = String(asNumber);
let flag = Boolean(asNumber);
document.getElementById("out").textContent =
"raw=" + raw +
" | number=" + asNumber +
" | text=" + asText +
" | flag=" + flag;
</script>
</body>
</html>

El párrafo muestra la misma idea en tres formas. Cambia raw a "0", actualiza y verás flag en false mientras el número sigue siendo 0.

Pruébalo tú

  1. Registra String(99), String(false) y typeof String(99).
  2. Registra Number("8") y Number("8") + 2 — matemáticas, no "82".
  3. Registra Number("oops") y su typeof (NaN, aún "number").
  4. Registra Boolean("") y Boolean("ok").
  5. Registra 3 + "4" y reescribe con Number("3") + Number("4").
  6. En el demo HTML pon raw = "0", actualiza y lee el nuevo flag.

Errores comunes

  • Creer que + siempre suma — una cadena puede concatenar
  • Ignorar NaN tras Number("hello") y usarlo en cálculos
  • Pensar que esta lección sustituye truthy / falsy — Boolean() es solo vista previa
  • Esperar que String(null) sea "" — es el texto "null"
  • Olvidar typeof cuando el resultado parece raro

Resumen

  • Conversión de tipos: cambiar a propósito el tipo de un valor
  • Prefiere String(), Number(), Boolean() para intención clara
  • Texto no numérico → NaN; typeof NaN sigue "number"
  • + con cadena suele concatenar — convierte antes de sumar
  • Siguiente: truthy y falsy — qué valores actúan como true o false en condiciones

🧠 Pon a Prueba tu Conocimiento

Listo para Empezar

Pon a Prueba tu Conocimiento

Ponte a prueba con este cuestionario interactivo y descubre qué tan bien entiendes el tema

❓
8
Preguntas
🎯
70%
Para Aprobar
♾️
∞
Tiempo
🔄
∞
Intentos

📝 Instrucciones

  • Lee cada pregunta cuidadosamente
  • Selecciona la mejor respuesta para cada pregunta
  • Puedes repetir el quiz tantas veces como quieras
  • Tu progreso se mostrará en la parte superior