Manejo de Errores
JavaScript puede lanzar un error y nosotros lo podemos capturar.
La Sentencia try … catch
La sentencia try ejecuta un bloque de códigos y la sentencia catch muestra una o más respuestas cuando se lanza un error.
En el Código 123, al cargar la página, JavaScript lanza un error que lo muestra la etiqueta <p> porque la función miFuncion() no está definida.
Código 123: La Sentencia try … catch
<!-- Archivo: codigo123.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<p id="demo"></p>
<!-- Códigos de JavaScript -->
<script>
try {
miFuncion();
}
catch(err) {
document.getElementById("demo").innerHTML = err;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo123.html
En la Figura_138, al cargar la página aparece el texto ReferenceError: miFuncion no está definida que es un error.
Código 123: La Sentencia try … catch
La Sentencia throw
La sentencia throw nos permite personalizar el mensaje del error que se produce.
En el Código 124, al cargar la página, JavaScript lanza un error con la sentencia throw que lo muestra la etiqueta <p>.
Descargar archivo codigo124.html
Código 124: La Sentencia throw
<!-- Archivo: codigo124.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<p id="demo"></p>
<!-- Códigos de JavaScript -->
<script>
try {
throw ("Ocurrió un error");
}
catch(err) {
document.getElementById("demo").innerHTML = err;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo124.html
En la Figura_139, al cargar la página aparece el texto Ocurrió un error con la sentencia throw.
Código 124: La Sentencia throw
La Sentencia finally
La sentencia finally ejecuta un bloque de código después de las sentencias de try y catch. La sentencia finally siempre se ejecuta.
En el Código 125, al cargar la página, JavaScript lanza un error con la sentencia throw y el texto del error lo muestra en la etiqueta <p> de id="demo1", después se ejecuta la sentencia finally y el mensaje de finally lo muestra en la etiqueta <p> de id="demo2".
Descargar archivo codigo125.html
Código 125: La Sentencia finally
<!-- Archivo: codigo125.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<p id="demo1"></p>
<p id="demo2"></p>
<!-- Códigos de JavaScript -->
<script>
try {
throw ("Ocurrió un error");
}
catch(err) {
document.getElementById("demo1").innerHTML = err;
}
finally {
document.getElementById("demo2").innerHTML = "Hola Mundo";
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo125.html
En la Figura_140, al cargar la página aparece el texto Ocurrió un error con la sentencia throw y después aparece el texto Hola Mundo con la sentencia finally.
Código 125: La Sentencia finally
En el Código 126, al escribir el número 15 en la etiqueta <input> y presiona el botón Entrar en la etiqueta <button>, aparece el mensaje: el Usuario debe ser mayor, mensaje generado con la sentencia throw y lo muestra en la etiqueta <p>.
Descargar archivo codigo126.html
Código 126: La Sentencia throw
<!-- Archivo: codigo126.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<title> Ejercicio </title>
</head>
<body>
<!-- Formulario de datos -->
<form>
<label>Edad:</label>
<input type="number" id="edad"></input>
<button onclick="entrar()" type="button" id="submit">Entrar</button>
</form>
<!-- Muestra el texto -->
<p id="demo"></p>
<!-- Códigos de JavaScript -->
<script>
// Función entrar
function entrar() {
// De texto a número
var edad = parseInt(document.getElementById("edad").value);
// Sentencia para capturar el error
try {
// La condición para entrar
if(edad<18) {
throw ("El Usuario debe ser mayor");
} else {
document.getElementById("demo").innerHTML = "El Usuario puede entrar";
}
}
catch(err) {
document.getElementById("demo").innerHTML = err;
}
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo126.html
En la Figura_141, al escribir el número 15 y presionar Entrar aparece el mensaje El Usuario debe ser mayor.
Código 126: La Sentencia throw
El error RangeError es lanzado cuando una variable numérica o parámetro está fuera de su rango válido.
En el Código 127, al cargar la página, JavaScript lanza un error de rango con la sentencia try porque la función toExponential() solo acepta números positivos y después se ejecuta la sentencia catch, la variable err.name muesta el nombre del error en la etiqueta <span> de id="nombre" y err.message muestra la descripción del error en la etiqueta <span> de id="mensaje".
Descargar archivo codigo127.html
Código 127: Error de Rango (RangeError)
<!-- Archivo: codigo127.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<!-- Muestra el texto -->
Nombre: <span id="nombre"></span>
<br/>
Descripción: <span id="mensaje"></span>
<!-- Códigos de JavaScript -->
<script>
// Asignar valor a la variable
var numero = 21.555;
// Sentencia para capturar el error
try {
// A la exponencial -2
numero.toExponential(-2);
}
catch(err) {
document.getElementById("nombre").innerHTML = err.name;
document.getElementById("mensaje").innerHTML = err.message;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo127.html
En la Figura 142, al cargar la página ocurre un error con la sentencia try, el exponencial debe ser positivo y después se ejecuta la sentencia catch el nombre del error que es RangeError y la descripción del error que es precisión -2 our of range.
Código 127: Error de Rango (RangeError)
Error de Referencia (ReferenceError)
El error ReferenceError es lanzado cuando una referencia no existe.
En el Código 128, al cargar la página, JavaScript lanza un error de rango con la sentencia try porque no está declarado la variable num2 y después se ejecuta la sentencia catch, la variable err.name muesta el nombre del error en la etiqueta <span> de id="nombre" y err.message muestra la descripción del error en la etiqueta <span> de id="mensaje".
Descargar archivo codigo128.html
Código 128: Error de Referencia (ReferenceError)
<!-- Archivo: codigo128.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<!-- Muestra el texto -->
Nombre: <span id="nombre"></span>
<br/>
Descripción: <span id="mensaje"></span>
<!-- Códigos de JavaScript -->
<script>
// Asignar valor a la variable
var num1 = 21.555;
// Sentencia para capturar el error
try {
// Sumar dos números
var total = num1 + num2;
}
catch(err) {
document.getElementById("nombre").innerHTML = err.name;
document.getElementById("mensaje").innerHTML = err.message;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo128.html
En la Figura 143, al cargar la página aparece un error con la sentencia try, la variable num2 no está declarada y después se ejecuta la sentencia catch el nombre de error que es ReferenceError y la descripción del error que es num2 is not defined.
Código 128: Error de Referencia (ReferenceError)
Error de Sintasis (SyntaxError)
El error SyntaxError es lanzado cuando algo está mal escrito dentro del método eval().
En el Código 129, al cargar la página, JavaScript lanza un error de sintasis con la sentencia try porque hay un error dentro del método eval() y después se ejecuta la sentencia catch, la variable err.name muesta el nombre del error en la etiqueta <span> de id="nombre" y err.message muestra la descripción del error en la etiqueta <span> de id="mensaje".
Descargar archivo codigo129.html
Código 129: Error de Sintasis (SyntaxError)
<!-- Archivo: codigo129.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<!-- Muestra el texto -->
Nombre: <span id="nombre"></span>
<br/>
Descripción: <span id="mensaje"></span>
<!-- Códigos de JavaScript -->
<script>
// Sentencia para capturar el error
try {
// Detecta un error
eval("document.write('Hola Mundo)");
}
catch(err) {
document.getElementById("nombre").innerHTML = err.name;
document.getElementById("mensaje").innerHTML = err.message;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo129.html
En la Figura 144, al cargar la página ocurre un error con la sentencia try porque en el método eval() al texto ‘Hola Mundo le falta una comilla al final y después se ejecuta la sentencia catch, el nombre de error que es SyntaxError y la descripción del error que es “ literal not terminated before end of script.
Código 129: Error de Sintasis (SyntaxError)
Error de Tipo (TypeError)
El error TypeError es lanzado cuando una variable o parámetro no es de un tipo válido.
En el Código 130, al cargar la página, JavaScript lanza un error de tipo con la sentencia try porque la variable texto no es un valor numérico y la función toFixed() es para fijar a un número a 1 o más decimales y después se ejecuta la sentencia catch, la variable err.name muesta el nombre del error en la etiqueta <span> de id="nombre" y err.message muestra la descripción del error en la etiqueta <span> de id="mensaje".
Descargar archivo codigo130.html
Código 130: Error de Tipo (TypeError)
<!-- Archivo: codigo130.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<!-- Muestra el texto -->
Nombre: <span id="nombre"></span>
<br/>
Descripción: <span id="mensaje"></span>
<!-- Códigos de JavaScript -->
<script>
// Asignar valor a la variable texto
var texto = "Hola Mundo";
// Sentencia para capturar el error
try {
// Fijar a dos decimales al número
var x = texto.toFixed(2);
}
catch(err) {
document.getElementById("nombre").innerHTML = err.name;
document.getElementById("mensaje").innerHTML = err.message;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo130.html
En la Figura 145, al cargar la página ocurre un error con la sentencia try porque la variable texto no tiene un valor numérico y después se ejecuta la sentencia catch, el nombre de error que es TypeError y la descripción del error que es “ literal not terminated before end of script.
Código 130: Error de Tipo (TypeError)
Error de URI (URIError)
El error URIError es lanzado cuando el método encodeURI() o decodeURI() tienen parámetros inválidos.
En el Código 131, al cargar la página, JavaScript lanza un error de URI con la sentencia try porque la función decodeURI() tiene el parámetro incorrecto y después se ejecuta la sentencia catch, la variable err.name muesta el nombre del error con la etiqueta <span> de id="nombre" y err.message muestra la descripción del error en la etiqueta <span> de id="mensaje".
Descargar archivo codigo131.html
Código 131: Error de URI (URIError)
<!-- Archivo: codigo131.html -->
<!-- Documento HTML5 -->
<!DOCTYPE html>
<html>
<head>
<!-- La etiqueta meta que da el formato en español -->
<meta charset="UTF-8">
<!-- Título en la pestaña del navegador -->
<title> Ejercicio </title>
</head>
<body>
<!-- Muestra el texto -->
Nombre: <span id="nombre"></span>
<br/>
Descripción: <span id="mensaje"></span>
<!-- Códigos de JavaScript -->
<script>
// Sentencia para capturar el error
try {
// Método URI
var x = decodeURI("%EO%A4%A");
}
catch(err) {
document.getElementById("nombre").innerHTML = err.name;
document.getElementById("mensaje").innerHTML = err.message;
}
</script>
</body>
</html>
Enlace: localhost/js_ajax_jquery/codigo131.html
En la Figura 146, al cargar la página ocurre un error con la sentencia try porque el método decodeURI() tiene el parámetro incorrecto y después se ejecuta la sentencia catch, el nombre de error que es URIError y la descripción del error que es malformed URI sequence.
Código 131: Error de URI (URIError)
Comentarios
Publicar un comentario