Cargando...

null y undefined

Ya viste los booleanos — un sí o no claro. A veces el programa también debe decir «aquí no hay valor.» JavaScript tiene dos vacíos habituales: undefined y null. Parecen parecidos, pero cada uno cuenta una historia distinta. Aquí los separamos para que las conversiones y comprobaciones posteriores tengan sentido.

¿Cuál es la diferencia entre null y undefined?

undefined suele significar «aún no hay nada» — una variable con let sin asignar, o algo que falta. null significa «vacío a propósito»: tú (o una API) asignas null para limpiar un hueco. Comprueba con typeof: typeof undefined es "undefined", pero typeof null es la rareza antigua "object". Prefiere === al comparar. Ambos son falsy, pero no son booleanos (true / false).

Kit de valores vacíos

📊 null frente a undefined para principiantes

Idea Ejemplo Resultado / nota
Ausente / sin asignar let x; luego x undefined
Vacío intencional let box = null tú eliges vacío
typeof ausente typeof undefined "undefined"
typeof vacío typeof null "object" (rareza — sigue siendo vacío)
Comparación estricta box === null true si box guarda null
Comparación flexible null == undefined true con == — prefiere === por claridad

undefined — aún sin asignar

Declara un nombre con let y no asignes. El valor es undefined. Registra el valor y typeof para fijar la etiqueta "undefined".

undefined por defecto

javascript
let nickname;
console.log(nickname);
console.log(typeof nickname);

null — vacío a propósito

Asigna null cuando quieras señalar con claridad «sin valor». No es lo mismo que olvidar la asignación.

asignar null a propósito

javascript
let selected = null;
console.log(selected);
console.log(typeof selected);

typeof lado a lado

Pon ambos resultados juntos. Recuerda: typeof null mostrando "object" es una rareza, no una lección completa de objetos todavía.

typeof de undefined y null

javascript
console.log(typeof undefined);
console.log(typeof null);
let a;
let b = null;
console.log(typeof a);
console.log(typeof b);

Prefiere === con null y undefined

=== pregunta por valor y tipo. Úsalo cuando quieras decir «exactamente null» o «exactamente undefined». Con ==, null y undefined pueden coincidir — fácil de malinterpretar al aprender.

comprobaciones estrictas con ===

javascript
let user = null;
let title;
console.log(user === null);
console.log(title === undefined);
console.log(user === undefined);

== flexible puede mezclarlos

Con ==, null y undefined coinciden. Regístralo una vez — luego mantén las comprobaciones reales con ===.

== flexible entre null y undefined

javascript
console.log(null == undefined);
console.log(null === undefined);

La primera línea es true porque == es flexible. La segunda es false. Escribe las comprobaciones reales con === para que la intención quede clara.

Muestra ambos vacíos en la página

Guarda un nombre al estilo undefined y otro con null, luego escribe etiquetas cortas con textContent.

Etiquetas de página para null y undefined

html
<!DOCTYPE html>
<html>
<head>
<title>null and undefined — labels</title>
</head>
<body>
<p id="out">…</p>
<script>
let title;
let avatar = null;
document.getElementById("out").textContent =
"title=" + title + " | avatar=" + avatar;
</script>
</body>
</html>

El párrafo muestra ambos vacíos en una línea. Cambia solo avatar a un texto corto, actualiza y comprueba que la mitad derecha cambia mientras title sigue siendo undefined.

Pruébalo tú mismo

  1. Declara let city; — registra city y typeof city sin asignar.
  2. Pon let bag = null; — registra el valor y typeof bag (espera la rareza "object").
  3. Registra typeof undefined y typeof null juntos para ver el contraste.
  4. Compara con ===: una variable null frente a null y frente a undefined.
  5. Registra una vez null == undefined; luego escribe tus comprobaciones reales con ===.
  6. En la demo HTML, pon avatar en "pic.png", actualiza y lee la nueva línea.

Errores comunes

  • Tratar null y undefined como siempre intercambiables — el significado cambia (intencional vs. sin asignar)
  • Entrar en pánico cuando typeof null es "object" — rareza; null sigue siendo vacío intencional
  • Confiar en == entre ellos sin notar la coincidencia flexible
  • Llamar a cualquiera booleano — son vacíos; los booleanos son solo true / false
  • Confundir la cadena vacía "" con null — "" sigue siendo texto

Resumen

  • undefined: ausente / aún sin asignar; typeof → "undefined"
  • null: vacío intencional que asignas tú; typeof → "object" (rareza)
  • Prefiere === para comprobaciones claras; ambos son falsy pero no booleanos
  • La cadena vacía "" es texto — no es lo mismo que null o undefined
  • Siguiente: conversión de tipos — cambiar un valor de un tipo a otro a propósito

🧠 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