Bienvenidos sean a este post, en el pasado hemos hablado sobre funciones para Javascript pero hoy veremos como es una funcion anonima para este lenguaje.
Pero que es una funcion anonima? Es una funcion sin nombre o identificador que nos permiten ser pasadas a otras funciones o asignadas a variables, en el caso de asignarlo a una variable el nombre de la misma lo usaremos como identificador de la funcion, veamos un ejemplo:
var miFuncion = function(valor){
valor *= 2;
return valor;
};
var total = 2;
for (i = 0; i <10; i++)
{
total = miFuncion(total);
}
alert(total);En este caso la funcion anonima es la variable miFuncion para crearla usamos a function y entre los parentesis tomamos un argumento para procesar en la funcion, en el bloque de las instrucciones multiplicamos al valor por 2 y devolvemos dicho valor, para finalizarlo cerramos la llave y le agregamos un punto y coma (;) como cierre de la variable, despues por fuera de esta funcion creamos otro variable llamada total con un valor inicial de 2 y luego un bucle for que contara de 0 a 9, en el bloque del bucle asignaremos a total el valor obtenido de la funcion anonima y en este caso le enviaremos el valor de total para que lo procese, una vez finalizado el bucle mostraremos por medio de un alert el valor final de total
Como pueden observar nuestra funcion se proceso correctamente y solo hemos utilizado variables, esto es muy util para ciertas eventualidades que podemos tener a la hora de trabajar con algunos eventos o funciones donde necesitaremos usar este tipo de sintaxis, otra forma de trabajar para las funciones anonimas es la siguiente:
var miFuncion = function(valor){
valor *= 2;
return valor;
}(35);
alert(miFuncion);En este caso enviamos un valor directamente a la variable porque utilizamos los parentesis antes del punto y coma (;) y este automaticamente interpretara que debe asignarse a valor y debe ser procesado, luego tenemos una notificacion del valor procesado
Para entender mejor este concepto veamos el siguiente ejemplo:
anonima.html
<html>
<head>
<script language="javascript">
<!--
document.title="Funcion Anonima";
var sumar=function(a,b){
var total;
total = a + b;
return total;
};
function ejecutar()
{
var a=parseInt(document.getElementById("a").value);
var b=parseInt(document.getElementById("b").value);
var total=document.getElementById("resultado");
total.innerHTML="El resultado es: " + sumar(a,b);
}
//-->
</script>
</head>
<body>
Ingresa un valor:
<input type="text" id="a" value=""><br>
Ingresa otro valor:
<input type="text" id="b" value=""><br><br>
<button type="button" onClick="ejecutar()">Sumarlos!</button>
<div id="resultado"></div>
</body>
</html>En este codigo tenemos primero un codigo HTML donde ingresaremos dos valores por medio de campos llamados a y b, despues tendremos un boton que llamara a la funcion ejecutar cuando pulsen al mismo, por ultimo tenemos un div llamado resultado.
Pasemos al tag SCRIPT donde tendremos una asignacion del titulo del documento, nuestro siguiente bloque es la funcion anonima que asignaremos a la variable sumar, esta funcion recibe dos argumentos llamados a y b, dentro del bloque crearemos una variable llamada total, a esta variable le asignaremos la sumatoria de a + b, y luego lo devolveremos por medio de return al valor de total, nuestro siguiente bloque sera la funcion ejecutar, esta se encargara de obtener los valores almacenados en los campos HTML, para ello crearemos dos variables llamadas a y b donde almacenaran los valores de los campos a y b respectivamente, en ambos casos usaremos un parseInt para transformar dicho valor a tipo int (entero), dentro usaremos a getElementById para que busque en el documento el id informado y a su vez el valor almacenado en la propiedad value del elemento, nuestra siguiente linea es un objeto llamado total donde usaremos a getElementById para asignarle el elemento llamado resultado, para nuestra siguiente linea usaremos a total y por medio de innerHTML le escribiremos un texto y usaremos a la variable sumar para obtener el resultado de la suma de los valores almacenados en a y b informadas a la misma, si probamos el programa obtendremos una salida semejante a esta
En este caso podemos ver como se ejecuto correctamente la suma de los dos valores por medio de una funcion anonima y a su vez fue llamado desde otra funcion.
En resumen, hoy hemos visto funciones anonimas, como son, para que sirven, sus estructuras mas usadas, algunas ventajas que nos proporcionan, espero les haya sido util sigueme en tumblr, Twitter o Facebook para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.
Tengo un Patreon donde podes acceder de manera exclusiva a material para este blog antes de ser publicado, sigue los pasos del link para saber como.
Tambien podes donar
Es para mantenimiento del sitio, gracias!
$1.50
El blog de Tinchicus 