Depurar Javascript Chrome

| | | | | | | | | | | | | | | | | | | | | | |

Incluso para los profesionales, la codificaciòn no es fácil. Esa es probablemente la razòn por la que los desarrolladores dedican gran parte de su tiempo a buscar errores en su còdigo. A veces, un error es obvio, lo que hace que todo el programa se rompa de una vez. Otras veces, un error es muy sutil, produciendo un resultado de aspecto correcto que, sin embargo, contiene defectos. & Nbsp;

Por contradictorio que parezca, los errores obvios son mejores porque son más fáciles de encontrar. Un error furtivo puede acechar durante a√±os en el software que se usa todos los dìas. & Nbsp;

Piénselo de esta manera: si estuviera en un edificio que se llenara lentamente de gas venenoso, ¿querrìa que el gas se ser inodoro, insìpido e incoloro, o de color p√∫rpura brillante y con olor a pòlvora? & nbsp;

Porque la depuraciòn es un paso crucial en el proceso de desarrollo , existen muchas herramientas para hacerlo. Hoy vamos a hablar sobre la depuraciòn de JavaScript en Chrome. Javascript es de lejos uno de los lenguajes más populares en general, y probablemente el lenguaje más popular para el desarrollo web. Del mismo modo, Chrome es uno de los navegadores web más utilizados. & Nbsp;

Como alguien que pronto será un en demanda desarrollador web , es una buena idea familiarizarse con la depuraciòn de JavaScript con Chrome. Te animo a que sigas esta ingenioso ejemplo de página web creado especìficamente para practicar la depuraciòn. & nbsp;

Uso del panel de origen & nbsp;

Foto 1453576109701 Aef2d431a8a4
Muchas profesiones tienen el equivalente a un panel de control, y tienes que aprender a usar el equivalente de desarrollador web. & nbsp;
< / figure>

Chrome viene construido con una serie de herramientas poderosas que permiten a los desarrolladores inspeccionar el còdigo fuente de un sitio web, incluido HTML, CSS y Javascript.

Esta es una fantástica una forma de leer el còdigo de los sitios web que le gustan y aprender a depurarlos.

Mirando a su alrededor & nbsp;

A partir de 2019 y la versiòn más reciente de Chrome, acceder a las herramientas para desarrolladores es tan simple como ir a Ver -" Desarrollador -" Herramientas para desarrolladores en el men√∫ del navegador en la parte superior de la pantalla. Esto abre el panel de desarrollador de Chrome con sus muchas pesta√±as √∫tiles. & Nbsp;

La pesta√±a " Elementos " te permite inspeccionar el HTML y Javascript que componen la página web. La pesta√±a " Consola " proporciona un lugar para que juegues con Javascript. Abre la consola para la & nbsp; página de ejemplo vinculada en la secciòn anterior y escriba console.log (" hola "). Este comando de JavaScript debe ejecutarse en el navegador.

La pesta√±a " Fuentes " muestra el contenido real de los archivos fuente de la página y le brinda una forma de establecer puntos de interrupciòn e inspeccionar la pila de llamadas.

Puntos de interrupciòn y depurador;

Junto con las declaraciones de impresiòn, los puntos de interrupciòn son una de las técnicas básicas que los desarrolladores utilizan para depurar.

Establecer un punto de interrupciòn en la consola de Chrome es fácil: simplemente haga clic en el n√∫mero de lìnea que le interesa . Un punto de ruptura es un lugar w aquì el còdigo se detiene automáticamente en su ejecuciòn. Esto le permite inspeccionar todo lo que ha sucedido hasta este punto, incluidos aspectos como el valor actual de cada variable y todas las transformaciones que han tenido lugar. & Nbsp;

Los puntos de interrupciòn son una excelente manera para comprobar el progreso de su còdigo para ver si algo ha salido mal. & nbsp;

Podemos lograr manualmente el mismo efecto colocando el depurador; en nuestro còdigo donde queramos comenzar el proceso de depuraciòn. & nbsp;

Al establecer varios puntos de interrupciòn, podemos obtener una vista de cerca de todo lo que hace nuestro còdigo, lo que hace que sea mucho más fácil de detectar errores. & nbsp;

Si bien esto ciertamente no es todo lo que necesita para dominar el arte de la depuraciòn, es una gran ventaja. La mayor parte de corregir el còdigo con éxito se reduce a pensar con mucha paciencia y claridad en lo que querìa que hiciera su còdigo y compararlo con lo que realmente le dijo a su còdigo que hiciera. & Nbsp ;

< / div>

Con la informaciòn anterior, ya está en camino de depurar JavaScript con Chrome. & nbsp;