Depuración de Errores

Santos A. laserna López

Cómo depurar errores en Javascript

Dentro de la programación Javascript debemos prestar especial atención, como en cualquier otro lenguaje, a la sintaxis del mismo.

Sin embargo, antes de entrar en los consejos de depuración, hay que tener en cuenta los scripts que estamos utilizando en relación con las versiones de navegadores que son compatibles, y saber que a veces un código preparado para las últimas versiones de los navegadores puede generar problemas con navegadores no tán actualizados.

Cada lenguaje tiene sus normas de escritura, sus órdenes y preferencias, y en el caso de Javascript, cometer un error de un caractér en una línea de código puede suponer la inhabilitación de una parte del código y generar errores de funcionamiento en todo el script.

En lo relativo a la sintaxis se recomienda:

• Utilizar comentarios para recordar qué está haciendo el script en esa línea de código.
• Tener cuidado de no confundir variables locales con globales, que pueden tener el mismo nombre.
• Escribir el código con claridad, mediante saltos de línea, un sangrado adecuado, utilizar llaves {} siempre, aunque no sean obligatorias e intentar manter el estilo a la hora de programar.
• Declarar las variables con var. No cambiar el tipo de dato que contiene. Por ejemplo, las variables de texto pueden empezar por una s (de String), las variables numéricas pueden empezar por una n o las boleanas por una b
• Probar los scripts cada poco que se va programando. Es más fácil encontrar errores de código en bloques pequeños.

Estos errores se clasifican en dos tipos; de sintaxis y de ejecución:

1. Errores de sintaxis ocurren a la hora de escribir el nombre de una estructura, utilizar incorrectamente las llaves o los paréntesis.
2. Errores de ejecución ocurren cuando se están ejecutando los scripts.

También podemos cometer fallos en la programación que hagan que los scripts no funcionen tal y como deseábamos y que javascript no detecta como errores y por lo tanto no muestra ningún mensaje de error.

A continuación, una serie de consejos para evitar errores comunes:

• Utilizar = en expresiones condicionales en lugar de == es un error difícil de detectar cuando se comete, si utilizamos un solo igual lo que estamos haciendo es una asignación y no una comparación para ver si dos valores son iguales.

• No conocerse la precedencia de operadores y no utilizar paréntesis para agrupar las operaciones que se desea realizar. En este caso nuestras operaciones pueden dar resultados no deseados.

• Usar comillas dobles y simples erróneamente. Recuerda que se pueden utilizar comillas dobles o simples indistintamente, con la norma siguiente: dentro de comillas dobles se deben utilizar comillas simples y viceversa.
• Olvidarse de cerrar una llave o cerrar una llave de más.
• Colocar varias sentencias en la misma línea sin separarlas de punto y coma. Esto suele ocurrir en los manejadores de eventos, como onclick, que veremos más adelante. 
• Utilizar una variable antes de inicializarla o no declarar las variables con var antes de utilizarlas. Recuerda que si no la declaras puedes estar haciendo referencia a una variable global en lugar de una local.
• Contar las posiciones de los arrays a partir de 1. Recuerda que los arrays empiezan por la posición 0.

Una técnica de depuración que nos ayuda a encontrar errores es la función predefinida alert() que recibe entre paréntesis un texto y lo muestra en una pequeña ventana.

Con la función alert() podemos mostrar en cualquier momento el contenido de las variables que estamos utilizando en nuestros scripts. Para ello ponemos entre paréntesis la variable que deseamos ver su contenido. Cuando se muestra el contenido de la variable el navegador espera a que apretemos el botón de aceptar y cuando lo hacemos continúa con las siguientes instrucciones del script.

Con todo esto, los paros a seguir para una correcta depuración del código son:

1. Utilizar nombres de variables que sean totalmente descriptivos.
2. Comenta secciones de código para identificar dónde se encuentra el problema.
3. Diferencia las variables en función de su importancia. (coloca las variables globales en la cabecera del script)
4. Separa y tabula el texto del código en su orden de jerarquía.
5. Documenta el código para ayudar a entender qué sucede en cada parte.