Desarrollador web frontend en Frontend Club
Los errores pueden ocurrir (ocurrirán) cada vez que escriba algo de código en una nueva computadora.
Depuración de código
El código de programación puede contener errores de sintaxis o errores lógicos.
Muchos de estos errores son difíciles de diagnosticar.
A menudo, cuando el código de programación contiene errores, no sucederá nada. No hay mensajes de error y no obtendrá indicaciones sobre dónde buscar errores.
Buscar (y corregir) errores en el código de programación se denomina depuración de código.
Depuradores de JavaScript
La depuración no es fácil. Pero, afortunadamente, todos los navegadores modernos tienen un depurador de JavaScript integrado.
Los depuradores integrados se pueden activar y desactivar, lo que obliga a informar los errores al usuario.
Con un depurador, también puede establecer puntos de interrupción (lugares donde se puede detener la ejecución del código) y examinar variables mientras se ejecuta el código.
Normalmente (de lo contrario, siga los pasos al final de esta página), activa la depuración en su navegador con la tecla F12 y selecciona "Consola" en el menú del depurador.
El método console.log()
Si su navegador admite la depuración, puede usar console.log() para mostrar valores de JavaScript en la ventana del depurador:
Ejemplo:
<!DOCTYPE html>
<html>
<body>
<h1>Mi primera pagina web</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
Tip: Lea más sobre el método
console.log()en nuestro módulo JavaScript Console Reference
Establecer puntos de interrupción (breakpoints)
En la ventana del depurador, puede establecer puntos de interrupción (breakpoints) en el código JavaScript.
En cada punto de interrupción (breakpoint), JavaScript dejará de ejecutarse y le permitirá examinar los valores de JavaScript.
Después de examinar los valores, puede reanudar la ejecución del código (normalmente con un botón de reproducción).
La palabra clave debugger
La palabra clave debugger detiene la ejecución de JavaScript y llama (si está disponible) a la función de depuración.
Esto tiene la misma función que establecer un breakpoint en el depurador.
Si no hay depuración disponible, la declaración del depurador no tiene ningún efecto.
Con el depurador activado, este código dejará de ejecutarse antes de ejecutar la tercera línea.
Ejemplo:
let x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
Herramientas de depuración de los principales navegadores
Normalmente, activa la depuración en su navegador con F12 y selecciona "Consola" en el menú del depurador.
De lo contrario siga estos pasos:
Chrome
Abra el navegador.
En el menú, seleccione "Más herramientas".
En herramientas, elija "Herramientas de desarrollador".
Finalmente, seleccione Consola.
¿Sabías?
La depuración es el proceso de probar, encontrar y reducir errores en programas de computadora. El primer error informático conocido fue un error real (un insecto) atrapado en los componentes electrónicos.
W3Schools es el sitio de desarrolladores web más grande del mundo.
