Si alguna vez has tenido que desarrollar alguna aplicación web con gran cantidad de código JavaScript seguro que te has encontrado con algún error. Seguramente te habrás dado cuenta de que en esos casos IE no es tu mejor aliado. Los mensajes de error que genera el IE son bastante malos en mi opinión, en algunos casos no acierta ni la línea que contiene el error.

Si en vez de IE pruebas suerte con firefox, almenos tienes una consola donde aparece un error mucho más detallado y al hacer doble click en él vas al código problemático directamente.

Pero aún así, esto se puede mejorar muchísimo, gracias a firebug, una extensión de firefox que permite ver errores de javascript detalladamente, ejecutar código al vuelo, ver todo el árbol DOM, añadir breakpoints, observar variables,ver las peticiones HTTP, incluso las de AJAX (esto es realmente útil) y hasta puedes ver cómo evoluciona el uso del ancho de banda que genera tu web al cargarse. También es de gran utilidad la herramienta “Inspect”, que te permite mediante el ratón seleccionar un área de la web y visualizar instantaneamente el código referente a ella. Otra característica a destacar es que puedes editar CSS al vuelo y se aplica instantaneamente en la web, ideal para hacer pruebas y dar espaciados, cambiar colores, tamaños, etc.

Te recomiendo que la pruebes, es totalmente libre y gratuita y te permitirá avanzar mucho más rápido en el desarrollo de tus páginas web.

Si no puedes desarrollar con firefox también puedes probar la versión especial de firebug para otros navegadores, incluido IE.

Sí, es cierto, lo acabo de descubrir, y luego explicaré los detalles, pero antes quiero contar qué es lo que me ha llevado a afirmar esto.

La semana pasada me tocó analizar junto a un compañero un código JavaScript que no funcionaba correctamente, utilizaba arrays asociativos para almacenar distintas categorías, por ejemplo:

var paises = new Array();
paises['es'] = ‘España’;
paises['pt'] = ‘Portugal’;
paises['us'] = ‘Estados Unidos’;
paises['uk'] = ‘Reino Unido’;

Hasta aquí, todo parece normal, es un array asociativo, como clave guardo el código del país y como valor el nombre, igual que lo haría en PHP por ejemplo. Pero luego, al intentar ordenarlo con opciones.sort(); que supuestamente ordena el array, no funcionaba, ni siquiera pasándole como parámetro una función personalizada para la ordenación (Especificación del método sort)
Supusimos que el método sort() no soportaba arrays asociativos e implementamos la solución utilizando arrays normales y corrientes, con claves numéricas, a la vez que nos preguntábamos cómo podía ser que JavaScript tuviese esa falta tan grave.

Hoy me disponía a comentar este error y buscar una nueva implementación de sort que soportara arrays asociativos (o incluso hacerla yo mismo si no hubiese encontrado ninguna) cuando sin quererlo me he encontrado con que JavaScript no tiene arrays asociativos, no existen. Entonces, ¿Cómo es que el ejemplo anterior funciona? (Sin contar el método sort)

Funciona porque lo que estamos haciendo es añadirle propiedades al objeto de tipo Array. En JavaScript, cuando hacemos variable['nombre'] lo que ocurre es que añadimos una nueva propiedad con el nombre “nombre” al objeto “variable”. Por eso, si hacemos:

var paises = new Array();
paises['es'] = ‘España’;
paises['pt'] = ‘Portugal’;
paises['us'] = ‘Estados Unidos’;
paises['uk'] = ‘Reino Unido’;
alert(paises.length);

Si existiesen los arrays asociativos debería aparecer una ventanita con un 4 ¿verdad? Pues como no existen, sale un 0, porque no le estamos añadiendo valores al array, si no propiedades al objeto.

Otros hechos que hacen sospechar de que JavaScript no tiene soporte para arrays asociativos es que no hay forma de definir un array asociativo ni con el constructor del objeto Array ni con la sintaxis para crear un array de forma literal.

Me he sorprendido mucho al leer esto en http://www.andrewdupont.net/2006/05/18/javascript-associative-arrays-considered-harmful/ , pues llevo años viendo como en muchos tutoriales explican equívocamente cómo utilizar arrays asociativos en JavaScript, tal y como yo lo he hecho.