[Php-avanzado] Funciones anónimas

Matias Gea matigea en gmail.com
Jue Oct 18 10:57:28 ART 2012


Buenas.

Te funciona bien el código? No le falta un return? Debería ser:

botones.onclick =(function(links){ return function(){
document.location.href=links; }; })(linkid);

Lo que sucede es que si haces "botones.onclick
=function(){document.location.href=links};" el valor de la variable
queda enlazado a la variable, y tu variable está creada como global
(deberías hacer var linkid=..., para crearla en el ámbito de la
función). Por eso, al clickear cualquier botón usa el último valor que
se le cargó. Si crearas variables locales, el comportamiento es más
errático.

Lo más seguro es hacer que el valor sea estático para la funcion.

Primero tenemos que tener en cuenta que la propiedad onclik requiere
que se le de una función como parámetro. Tambien, que al llamar una
función entre paréntesis, la estamos ejecutando, es decir, al hacer:

(function(variable){ alert(variable); })('hola');

estamos creando una funcion anónima y ejecutándola a la vez con el
parámetro 'hola'. El return de esta función es undefined, como cualquier
funcion que no devuelve nada.

Lo que hacemos, específicamente para crear una función con un valor
estático sacado de una variable, es ejecutar una función anónima
pasando como parámetro la variable que queremos hacer estática y que
esta función devuelva otra función, que se va a asignar al evento.

Entonces:

botones.onclick =(function(links){
   return function(){
      document.location.href=links;
   };
})(linkid);

lo que hace es ejecutar una función anónima que crea un ámbito en el
que se setean las variables que le pasamos (en este caso links) con
los valores que pasamos al momento de la ejecución (que es el mismo
momento en que creamos esta función "creadora", por lo dicho antes) y
devuelve otra función anónima que toma sus propios parámetros (que
serán pasados por el manejador de eventos del browser, en este caso) y
donde la variable "links" tiene un valor estático.

Espero se haya entendido bien. Una vez que se entiende el concepto, es
simple, sino es un quilombo de funciones y paréntesis.

Otras dos cosas:
- Los parsers del lenguaje en casi todos los navegadores no lo marcan
como error, pero no te conviene "comerte" ningún punto y coma. El
parser busca un punto y coma, si no lo encuentra espera el final de
linea. Esto funciona muchas veces, pero si pasás el código por un
compresor o "minifier", vas a tener problemas, ya que estos sistemas
lo que hacen es quitar todos los espacios y saltos de linea antes de
comprimir, y te queda código inválido.
- Muchas veces no es problema, pero en sistemas que son muy intensivos
en el uso de javascript y en navegadores no muy modernos el uso de
recursos es importante. Te conviene ver bien el ámbito de todas las
variables y definir como locales las necesarias. Sino te quedan todas
las variables definidas como globales (a nivel window) y quedan
gastando memoria.

Saludos!


El día 18 de octubre de 2012 09:46, Juan Manuel P.
<tucu_21 en hotmail.com> escribió:
> Leo acá te paso lo que te comente ayer de las funciones anónimas. Así me han
> funcionado los eventos que tienen las etiquetas input (ya sean button,
> submit, reset, text, etc).
> Cuando creo uno de estas etiquetas mediante código JavaScript para después
> agregarlas al html la única forma que encontré es esta:
>
> while (i<Nombres.length)
>           {
>               //Crea boton Agregar, Modificar y Eliminar
>               botones = document.createElement('input');
>               botones.type = 'button';
>               botones.name = 'subbot'+i;
>               botones.value= Nombres[i];
>               botones.id=botones.name;
>               botones.style.marginLeft='25px';
>               linkid='../Admin/'+tagname.value+'/'+botones.value+'.php'
>             botones.onclick
> =(function(links){function(){document.location.href=links}})(linkid);
>               if(tagname.value=='relaciones' && i==1)
>               {
>                   botones.disabled=true;
>               }
>               contenedor.appendChild(botones);
>               i++;
>         }
>
>
> Si no lo hago de esta manera, por ejemplo haciendo:
>
> botones.onclick =function(){document.location.href=links};
>
> Cada vez que se hace click en cualquiera de todos los botones realiza la
> acción pero de el ultimo que se creo.
>
>
> In his heart, in his eyes
> In his soul, there’s no sign of thunder
> Screams, can you hear the screaming
> When another restless soul must die
>
> _______________________________________________
> Php-avanzado mailing list
> Php-avanzado en pato2.fi.mdp.edu.ar
> http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado



-- 
Matias Fernando Gea
matigea en gmail.com
http://www.mfgea.com.ar


Más información sobre la lista de distribución Php-avanzado