Manejo de Errores con «try…catch» en JavaScript
En programación, a pesar de nuestros mejores esfuerzos, los errores pueden surgir por diversas razones, como un descuido, una entrada inesperada del usuario, una respuesta incorrecta del servidor, entre otros factores. Normalmente, un script de JavaScript se detiene inmediatamente y muestra el error en la consola. Sin embargo, existe una estructura sintáctica llamada try...catch que permite «atrapar» esos errores y manejar la situación de manera más adecuada.
Sintaxis de “try…catch”
La construcción try...catch consiste en dos bloques principales: try y catch.
try {
// código...
} catch (err) {
// manejo del error
}
Así es como funciona:
- Primero, se ejecuta el código dentro del bloque
try {...}. - Si no hay errores, se ignora el bloque
catch (err) {...}y la ejecución continúa. - Si se produce un error, la ejecución se detiene y pasa al bloque
catch (err) {...}, donde la variableerrcontiene un objeto con detalles del error.
Esto significa que un error dentro del bloque try {...} no detendrá el script por completo; en su lugar, se gestionará dentro del bloque catch.
Ejemplos
Sin errores:
try {
alert('Inicio del bloque try'); // (1)
// ...no hay errores aquí
alert('Fin del bloque try'); // (2)
} catch (err) {
alert('Se ignora catch porque no hay errores'); // (3)
}
Con un error:
try {
alert('Inicio del bloque try'); // (1)
lalala; // error, la variable no está definida
alert('Fin del bloque try (nunca se alcanza)'); // (2)
} catch (err) {
alert('¡Ha ocurrido un error!'); // (3)
}
Limitaciones de try...catch
Errores de tiempo de ejecución solamente:
try...catchsolo funciona para errores que ocurren durante la ejecución del código válido de JavaScript, no para errores sintácticos.
try {
{{{{{{{{{{{{
} catch(err) {
alert("El código no es válido.");
}
Errores asíncronos: No puede capturar errores en funciones asíncronas programadas.
try {
setTimeout(function() {
noSuchVariable; // el script falla aquí
}, 1000);
} catch (err) {
alert("No funcionará");
}
Para manejar errores en funciones asíncronas, el try...catch debe estar dentro de la función asíncrona.
setTimeout(function() {
try {
noSuchVariable; // el try...catch captura el error
} catch (err) {
alert("¡Error detectado!");
}
}, 1000);
Objeto de Error
Cuando ocurre un error, JavaScript crea un objeto de error con detalles del mismo. Este objeto se pasa al bloque catch:
try {
// ...
} catch(err) { // `err` es el objeto error
// ...
}
Las propiedades principales del objeto de error son:
- name: Nombre del error (por ejemplo, «ReferenceError»).
- message: Detalles del error.
Hay otras propiedades como stack, que muestra la pila de llamadas en el momento del error.
Ejemplo:
try {
lalala; // error, la variable no está definida
} catch (err) {
alert(err.name); // ReferenceError
alert(err.message); // lalala no está definida
alert(err.stack); // Información de la pila de llamadas
}
Lanzar Nuestros Propios Errores
Podemos lanzar nuestros propios errores usando el operador throw.
throw new Error("Algo salió mal");
Ejemplo:
let json = '{ "age": 30 }'; // dato incompleto
try {
let user = JSON.parse(json);
if (!user.name) {
throw new SyntaxError("Datos incompletos: falta el nombre");
}
alert(user.name);
} catch (err) {
alert("Error en JSON: " + err.message); // Error en JSON: Datos incompletos: falta el nombre
}
Relanzando Errores
Si el bloque catch no sabe cómo manejar un error específico, puede relanzarlo:
try {
user = { /*...*/ };
} catch (err) {
if (err instanceof ReferenceError) {
alert('ReferenceError'); // Maneja errores de referencia
} else {
throw err; // Relanza errores desconocidos
}
}
Bloque Finally
El bloque finally se ejecuta siempre, independientemente de si hubo un error o no:
try {
alert('Intento (try)');
if (confirm('¿Generar un error?')) BAD_CODE();
} catch (err) {
alert('Captura (catch)');
} finally {
alert('Finalmente (finally)');
}
Captura Global de Errores
Los navegadores y otros entornos permiten capturar errores no manejados globalmente, como en window.onerror en navegadores.
window.onerror = function(message, url, line, col, error) {
alert(`${message} en ${line}:${col} de ${url}`);
};
Resumen
La estructura try...catch permite gestionar errores de tiempo de ejecución en JavaScript. Es importante manejar adecuadamente los errores para mejorar la robustez y la experiencia del usuario. Utilizando try...catch, throw y finally, podemos crear scripts más resistentes y mantener el control sobre los errores que puedan surgir.
try {
// código a intentar
} catch (err) {
// manejar el error
} finally {
// ejecutar siempre, independientemente del resultado
}
