Entradas etiquetadas ‘ eval ’

Evitar el uso de eval() en Javascript

Jueves, Noviembre 6, 2008

Hoy en el trabajo he descubierto que la función eval() de Javascript y Firebug se llevan muy mal. Tan mal que no conseguía depurar una clase que estoy desarrollando. Googleando un poco he conseguido encontrar varias formas de evitar eval() y algunos motivos por lo que es recomendable evitar su uso.

El funcionamiento de eval() es el siguiente:

  1. Se convierte el argumento en un String.
  2. Se parsea el String y se convierte en código Javascript.
  3. Se ejecuta el código Javascript resultante.

Evidentemente saltarse los pasos 1 y 2 mejora el rendimiento. Además evita esos problemas “raros” que he comentado antes con Firebug.

En concreto los problemas con los que me he encontrado incluían los siguientes usos de eval:

  • Asignar una propiedad a un objeto cuyo nombre está almacenado en un String.
  • Llamar a una función cuyo nombre está almacenado en un String.
  • Crear un objeto de una clase cuyo nombre está almacenado en un String.

Es decir, tres casos muy parecidos que se reducen a uno solo, acceder a variables cuyo nombre conocemos a posteriori. Para solucionar esto basta con saber que hay varias formas de acceder a una propiedad de un objeto en Javascript. La típica:

  1. objeto.atributo = valor

y la no tan típica:

  1. var nombreDelAtributo="atributo";
  2. objeto[nombreDelAtributo] = valor;

Ahora solo falta saber otra cosa. Cualquier variable se puede acceder también como un atributo del objeto window, un ejemplo:

  1. var cadena = "Hola mundo!";
  2. alert(window.cadena); //mostrará un alert con "Hola mundo!"
  3. alert(window[‘cadena’]); //también mostrara un alert con "Hola mundo!"

Ahora veamos algunos ejemplos de usos de eval() y otras formas de avordar el mismo problema.

  1. /*
  2. *asignar un valor a un atributo cuyo nombre no conocemos a priori
  3. */
  4. eval(‘objecto.’ + nombreDelAtributo + ‘=valorDelAtributo’);
  5. //se podría cambiar por
  6. objeto[nombreDelAtributo] = valorDelAtributo;
  7.  
  8. /*
  9. * Llamar a un metodo de un objeto estando el nombre del metodo almacenado en una variable
  10. */
  11.  
  12. eval(‘objeto.’ + nombreDelMetodo + ‘(argumento)’);
  13. //podría ser
  14. objeto[nombreDelMetodo](argumento);
  15.  
  16. /*
  17. * Crear un objeto de una clase teniendo el nombre de la clase en una variable
  18. */
  19.  
  20. eval(‘var objeto = new ‘ + nombreDeLaClase + ‘()’);
  21. //sería
  22. var objeto = new window[nombreDeLaClase]();

En el último ejemplo podemos hacer esto por que una clase es también una variable del programa, y como tal se almacena como un atributo del objeto window.

Y vosotros, ¿usáis eval() en vuestro código? ¿conocíais estas soluciones?

Publicado en Uncategorized | Etiquetas: , ,  | 7 comentarios »