Comunidad de diseño web y desarrollo en internet online

Funciones en Javascript: variables, objetos y anónimas

En vista que hay muchas personas (yo me incluyo) que les ha costado un poco el entender el verdadero poder de las funciones en Javascript y el entender en qué momento son anónimas, me puse a redactar una breve explicación para poder entender este tema con un poco mas de claridad.

Javascript se resume en una sola palabra: function


Algo que debemos tener claro cuando iniciamos es que, javascript, es un lenguaje dinámico interpretado por closures, que acepta programación orientada a objetos (no como la conocemos algunos, pero se asemeja mucho), en JS no existe una manera clara de crear closures, métodos, clases, y menos objetos, ya que todo esto lo hacemos con la misma palabra clave: function.

Así pues todo va depender del uso correcto o incorrecto que le brindemos a esta palabra mágica y terrible al mismo tiempo. Al llegar a esta línea te estarás preguntando ¿y para declarar un closure, un objeto, una clase o un método, todo se hace con function?, la respuesta es: por supuesto que si!, claro la palabra clave “this” tiene un significado más amplio, e incluso variable en función del contexto en el que se use, ahora para terminar de rematar y colocar la guinda en el pastel hay varias maneras de programar orientado a objetos, vamos a trabajar en este aporte con un ejemplo sencillo pero claro para entender los diferentes tipos de operaciones que podemos hacer con las functions.

El código a utilizar será el siguiente:

Código :

function saluda(quien){
  console.log("hola " + quien);
}
saluda ("mundo");


La salida sera el típico "hola mundo". Tranquilos, se pone interesante.

Las Funciones también pueden ser utilizadas como Datos.


Las funciones son definidas como tal, pero también pueden ser empleadas como datos, el hecho de definir una función con su propio nombre (en este caso "saluda") hace que, dentro de las variables globales se cree una llamada saluda, la cual podemos leer o pasar como parámetro a otra función como parámetro, por ejemplo:

Código :

function saluda(){
        console.log("hola");
}

function ejecuta(func){
        func();
}

ejecuta(saluda)



En esta porción de código lo que hacemos es ejecutar la funcion "ejecuta" que va mostrar lo que tenga la variable "func" que pasamos como parámetro la cual será la función "saluda" que hicimos arriba.

También podemos crear funciones como expresiones de esta manera:

Código :

var saluda = function(quien){
        console.log("hola " + quien);
}

saluda("mundo");


Con este código estamos creando en realidad es una función anónima y asignarle un nombre inmediatamente, por lo cual es equivalente a definir la función como lo hacíamos al principio con la sintaxis "function saluda(quien){ }".


Funciones anónimas y autoejecutables



Funciones anónimas

Una función anónima se puede definir sin que sea asignada a ninguna variable, por ejemplo:

Código :

function(quien){
        console.log("hola " + quien);
}


Sin embargo, hacer esto es totalmente inútil e inservible ya que, al definir una función sin nombre hace que sea imposible ser ejecutada más adelante, pues sin un nombre con el cual acceder a ella es imposible encontrarla (es como si a ustedes no les dieran un nombre al nacer, si se extravían algún día, no van a poder encontrarlos por su nombre porque no tienen uno).

Funciones autoejecutables


Para poder solucionar el problema anterior que teníamos con la función anónima podemos convertirla en una función auto ejecutable, para ello debemos encerrar entre paréntesis la function que hemos creado y añadirle un par de paréntesis al final y esta se ejecutará en el instante, por ejemplo:

Código :

(function() { console.log("hola mundo") }) ()


Por supuesto que podemos enviarle parámetros a funciones auto ejecutables los cuales irían dentro los paréntesis finales, por ejemplo:

Código :

( function(quien){
   console.log("hola " + quien);
})("mundo");


A primera vista se puede pensar que esto no sirve de nada y que no puede tener aplicaciones, pero en la vida de un programador puedes encontrarle múltiples usos.

¿Una función puede devolver una función anónima?, sí se puede, pero será responsabilidad del programador asignarle una variable, por ejemplo:

Código :

function saludator(quien){
        return function(){ //acá se crea la funcion anónima a retornar
                alert("hola " + quien);
        }
}

var saluda = saludator("mundo");

saluda();

O bien podemos ejecutar la función de retorno directamente sin asignarle ningún valor, ejemplo:

Código :

function saludator(quien){
        return function(){ //acá se crea la funcion anónima a retornar
                alert("hola " + quien);
        }
}

saludator("mundo")();


Funciones dentro de Funciones

Las funciones se pueden anidar, osea una función dentro de otra función. Estas funciones suelen llevar el nombre de inner-private, son inner porque son internas y private porque sólo son accesibles desde el código de la función donde son definidas en el siguiente código la función llamada "alerta saludo" solo puede ser invocada dentro de la función saludator:

Código :

function saludator(quien){
        function alertasaludo(){
                console.log("hola " +  quien);
        }

        return alertasaludo;
}

var saluda = saludator("mundo");
saluda();


Esto también se puede combinar con una función auto-ejecutable:

Código :

function saludator(quien){
        function alertasaludo(){
                console.log("hola " +  quien);
        }

        return alertasaludo;
}

saludator("mundo")();


Aquí un pequeño ejemplo de cómo combinar las funciones anónimas con las funciones auto ejecutables que tiene funciones como resultado (enredado pero bonito jajaja):

Código :

var parOimpar = (function(valor){
        if(valor%2 == 0){
                return function() {console.log("es un número par"); } 
        }else{
                return function() {console.log("es un número impar");}
        }
})

parOimpar(4)(); // acá le mando el 4 para hacer pruebas pero pueden hacerlo con cualquier número que funcionará


Resumiendo


  1. Las funciones pueden o no pueden llevar nombre, si no llevan nombre estas funciones son anónimas y para ser ejecutadas deben ser asignadas a una variable sino jamás se ejecutarán dentro del código.

  2. Una función se puede manipular como si fuera un dato común y corriente, el cual puede ser enviado como parámetro a otra función.

  3. Una función que es anónima puede ser auto ejecutable, sólo con ponerle encerrar la función en paréntesis y colocar un nuevo par de paréntesis afuera.

  4. Las funciones se pueden anidar dando por resultado una función.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate