Una sinfonía en C#

Un pequeño aporte a la comunidad de habla hispana.

Funciones autoejecutables en Javascript

Siguiendo con la serie “ahora tengo que programar Javascript aunque no quiera” vamos a ver una funcionalidad extraña pero interesante, las funciones autoejecutables.

Funciones normales

Una función normal en Javascript se declara de manera bastante clásica con el detalle que no podemos definir visibilidad ni valor de retorno, por ejemplo, una función que muestra un mensaje sería algo así:

function mensaje(){
	alert("mi nombre es Bond");
}

Simple, la función tiene un nombre y un cuerpo, opcionalmente podemos ponerle parámetros, del siguiente modo:

function mensaje(s){
	alert(s);
}

Si quisiéramos que se ejecute inmediatamente haríamos los siguiente:

function mensaje(s){
	alert(s);
}

mensaje("mi nombre es Bond");

Y listo

image

Pero qué sentido tiene nombrar una función que se va a ejecutar sólo cuando se inicia la página para invocarla en la siguiente línea? poco, entonces llegan las funciones autoejecutables.

Funciones autoejecutables

La idea es que la misma función se ejecuta en cuanto está preparada para ser ejecutada, la sintáxis es algo extraña pero vamos a ver el mismo ejemplo en una función autoejecutable.

(function (){
	alert("mi nombre es Bond");
})();

y obtenermos el mismo resultado

image

vamos a explicar esta expresión.

Si analizamos a partir de “function” es una función como cualquier otra, y de hecho lo es, pero sin nombre, el nombre podemos ponerlo o no.

function (){
	alert("mi nombre es Bond");
}

Vemos que toda esta función se encierra entre paréntesis

(function (){
	alert("mi nombre es Bond");
})

y por último dos paréntesis y punto y coma para invocarla

(function (){
	alert("mi nombre es Bond");
})();

Pasar parámetros a una función autoejecutable

El ejemplo anterior pasando el parámetro a la función autoejecutable sería así

(function (s){
	alert(s);
})("mi nombre es Bond");

image

y funciona perfecto, vemos que al final, en los paréntesis (la invocación a la función) pasamos los parámetros.

Hasta la próxima.

Comments (2) -

  • Bruno

    1/1/2012 6:42:51 PM | Reply

    Gracias por este tutorial, ahora entiendo mucho mejor jquery.

  • leonardo

    1/1/2012 6:49:37 PM | Reply

    Gracias por tu comentario Bruno, me alegro que te haya sido útil.

Loading