En este tutorial, aprenderá a depurar en JavaScript con la ayuda de ejemplos.
Puede encontrar y encontrará errores al escribir programas. Los errores no son necesariamente malos. De hecho, la mayoría de las veces, nos ayudan a identificar problemas con nuestro código. Es esencial que sepa cómo depurar su código y corregir errores.
La depuración es el proceso de examinar el programa, encontrar el error y solucionarlo.
Hay diferentes formas de depurar su programa JavaScript.
1. Usando console.log ()
Puede utilizar el console.log()método para depurar el código. Puede pasar el valor que desea verificar en el console.log()método y verificar si los datos son correctos.
La sintaxis es:
console.log(object/message);
Puede pasar el objeto console.log()o simplemente una cadena de mensaje.
En el tutorial anterior, usamos el console.log()método para imprimir la salida. Sin embargo, también puede utilizar este método para depurar. Por ejemplo,
let a = 5; let b = 'asdf'; let c = a + b; // if you want to see the value of c console.log(c); // then do other operations if(c) ( // do something )
El uso del console.log()método en el navegador abre el valor en la ventana del depurador.
Funcionamiento del método console.log () en el navegador
No console.log()es específico de los navegadores. También está disponible en otros motores de JavaScript.
2. Usando el depurador
La debuggerpalabra clave detiene la ejecución del código y llama a la función de depuración.
El debuggerestá disponible en casi todos los motores de JavaScript.
Veamos un ejemplo,
let a = 6; let b = 9; let c = a * b; // stops the execution debugger; console.log(c);
Veamos cómo puede usar el depurador en un navegador Chrome.
Funcionamiento del depurador en el navegador.
El programa anterior pausa la ejecución del programa en la línea que contiene el debugger.
A continuación, puede reanudar el control de flujo después de examinar el programa.
El resto del código se ejecutará cuando reanude el script presionando reproducir en la consola.
Funcionamiento del depurador en el navegador.
3. Establecer puntos de interrupción
Puede establecer puntos de interrupción para el código JavaScript en la ventana del depurador.
JavaScript dejará de ejecutarse en cada punto de interrupción y le permitirá examinar los valores. Luego, puede reanudar la ejecución del código.
Veamos un ejemplo estableciendo un punto de interrupción en el navegador Chrome.
Trabajo de puntos de interrupción en el navegador
Puede establecer puntos de interrupción a través de la herramienta Desarrolladores en cualquier parte del código.
Establecer puntos de interrupción es similar a colocar un depurador en el código. Aquí, simplemente establece puntos de interrupción haciendo clic en el número de línea del código fuente en lugar de llamar manualmente a la función de depuración.
En los métodos anteriores, hemos utilizado el navegador Chrome para mostrar los procesos de depuración para simplificar. Sin embargo, no es tu única opción.
Todos los IDE buenos le brindan una forma de depurar el código. El proceso de depuración puede ser un poco diferente, pero el concepto detrás de la depuración es el mismo.
