Gráffica Academy
Creado para la ComunidadAprende a programar
Escribir al equipo

Contacta con el equipo de Gráffica Estudio Academy.

IG @ X in
Fundamentos avanzados

Errores, debugging y buenas prácticas

Todo código falla alguna vez — la diferencia entre un programador con experiencia y uno que empieza no es que el primero no tenga errores, es que sabe manejarlos, encontrarlos y escribir código que sea más fácil de depurar desde el principio. Hoy cierras los fundamentos del lenguaje con eso: errores, debugging y unas cuantas reglas de estilo que te van a ahorrar disgustos.

Capturar errores con try / catch

Cuando una parte de tu código puede fallar (un dato mal formado, algo que no existe...), try / catch te permite capturar el error y decidir qué hacer, en lugar de que la ejecución se detenga en seco:

try-catch.js
1
Pulsa "Ejecutar" para ver el resultado.
try { }

El bloque de código que puede fallar.

catch (error) { }

Se ejecuta solo si algo dentro de try lanza un error. error.message tiene el texto del fallo.

finally { }

Se ejecuta siempre, haya habido error o no. Opcional.

throw new Error('...')

Lanza tu propio error a propósito, con un mensaje que tenga sentido para quien lo lea después.


Tipos de error habituales

TypeError

Intentas usar un valor de forma incompatible con su tipo — por ejemplo, llamar a un método que no existe en ese valor.

ReferenceError

Usas una variable que no existe o no está definida en ese scope.

SyntaxError

El código ni siquiera se puede leer: falta una llave, una comilla sin cerrar...


Depurar: cómo encontrar el problema

console.log estratégico

La herramienta más simple y más usada: ve imprimiendo valores en puntos clave para ver dónde el resultado deja de ser el esperado.

DevTools del navegador

F12 (o clic derecho → Inspeccionar) abre las herramientas de desarrollador, con una pestaña Console para ver errores y un depurador con breakpoints reales.

Leer el mensaje de error entero

El mensaje casi siempre dice exactamente qué pasó y en qué línea — es tentador ignorarlo, pero suele ser la pista más rápida.

Divide y vencerás

Si no sabes qué falla, comenta partes del código hasta aislar la línea exacta que causa el problema.

💡 El "rubber duck debugging"

Una técnica real (con ese nombre) muy usada entre programadores: explica tu código en voz alta, línea por línea, a un objeto cualquiera (tradicionalmente un patito de goma). Con frecuencia encuentras el error tú mismo mientras lo explicas, antes de terminar la frase.


Guía de estilo: escribe código que tu yo del futuro entienda

camelCase siempre

nombreUsuario, no nombre_usuario ni NombreUsuario, para variables y funciones.

const por defecto

Usa const salvo que sepas que vas a reasignar la variable — así el propio código documenta la intención.

Nunca var

let y const cubren todos los casos con reglas de scope más predecibles.

Nombres que se explican solos

calcularTotalConIva es mejor que calc() o x2(), aunque tengas que escribir más.

Indentación consistente

2 espacios es lo más habitual en JavaScript — elige uno y no lo mezcles en el mismo proyecto.

=== en vez de ==

Ya lo viste en el módulo de operadores — evita sorpresas de conversión de tipos.

Comprueba lo que has aprendido

3 preguntas · sin nota, solo para afianzar lo de hoy

1. ¿Cuándo se ejecuta el bloque finally de un try/catch?

2. ¿Qué tipo de error es típico al llamar a un método que no existe en un valor?

3. Según la guía de estilo del módulo, ¿qué deberías usar por defecto: let o const?

Síguenos IG @ X in