JavaScript Moderno y ES6+: Guía Práctica de Sintaxis Avanzada
Lo Que Dominarás en Este Tutorial
- Master safe property traversal with Optional Chaining and Nullish Coalescing.
- Understand deep object cloning with native structuredClone().
1. Nullish Coalescing and Optional Chaining
Before ES2020, developers used logical OR for defaults. Modern JavaScript solves this with ?? and ?.
const apiResponse = { user: { profile: { points: 0 } } };
const score = apiResponse.user?.profile?.points ?? 100;
console.log(score); // 0 (correctly preserved)
Evaluación Rápida: Pon a Prueba tus Conocimientos
Preguntas Frecuentes
Profundizando: el JavaScript moderno en la práctica
Las funciones de este tutorial aparecen por todas partes en el código de producción en cuanto empiezas a fijarte. La coalescencia nula y el encadenamiento opcional sustituyen código defensivo repetitivo, structuredClone elimina toda una categoría de errores por referencias compartidas (y una dependencia de lodash), y async/await sobre el bucle de eventos es la forma en que se escribe hoy cualquier llamada a una API. En la práctica, la fluidez consiste en saber qué herramienta encaja con cada situación: ?? cuando 0 o una cadena vacía son valores reales, ?. cuando una ruta puede estar legítimamente ausente, y una clonación de verdad cuando el objeto original no debe cambiar. Son operadores pequeños con efectos desproporcionados sobre la corrección, y por eso entrevistadores y revisores de código vuelven a ellos una y otra vez. Dominarlos no exige memorizar la especificación completa: exige practicar con ejemplos pequeños y deliberados hasta que elegir entre un operador u otro —y anticipar qué hará con cada tipo de valor— se vuelva un reflejo automático al leer y escribir código.
Errores comunes
- Usar || para valores por defecto. El OR lógico trata 0, '' y false como si faltaran y sustituye en silencio valores válidos: exactamente el error que ?? fue creado para corregir.
- Encadenamiento opcional en todas partes. Salpicar ?. sobre cada acceso oculta errores genuinos: una propiedad mal escrita devuelve undefined en lugar de fallar donde está el error.
- Mutar objetos compartidos. Asignar un objeto copia la referencia, no los datos; sin structuredClone, las ediciones «temporales» se filtran al estado original.
- Promesas flotantes. Llamar a una función async sin await ni .catch() deja los rechazos sin gestionar y hace que el orden de ejecución dependa de los tiempos en vez de la intención.
Preguntas frecuentes
¿Cuál es la diferencia entre || y ??
Como lo plantea el cuestionario de esta página: || recurre al valor alternativo ante cualquier valor falsy, mientras que ?? solo lo hace cuando el valor es null o undefined, así que 0 y false sobreviven con ??.
¿Cómo clono un objeto en profundidad sin lodash?
Usa el integrado structuredClone(obj), que —como señala este tutorial— ya cuenta con soporte nativo en todos los runtimes y navegadores modernos.
¿El encadenamiento opcional ralentiza mi código?
No de forma apreciable. Las comprobaciones que realiza son las mismas que escribirías a mano con cadenas de &&, solo que expresadas en una sintaxis más corta y segura.