Foros del Web » Programando para Internet » Javascript »

llamado extraño funcion (funcion(){})

Estas en el tema de llamado extraño funcion (funcion(){}) en el foro de Javascript en Foros del Web. He visto en varios frameworks que escriben ese tipo de funciones ejemplo: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código Javascript : Ver original ( function ( ) {   ...
  #1 (permalink)  
Antiguo 23/07/2010, 12:00
Avatar de minkweb  
Fecha de Ingreso: septiembre-2005
Mensajes: 443
Antigüedad: 19 años, 2 meses
Puntos: 14
llamado extraño funcion (funcion(){})

He visto en varios frameworks que escriben ese tipo de funciones ejemplo:

Código Javascript:
Ver original
  1. (function(){
  2.     var natives = {'Array': Array, 'Date': Date, 'Function': Function, 'Number': Number, 'RegExp': RegExp, 'String': String};
  3.     for (var n in natives) new Native({name: n, initialize: natives[n], protect: true});
  4.  
  5.     var types = {'boolean': Boolean, 'native': Native, 'object': Object};
  6.     for (var t in types) Native.typize(types[t], t);
  7.  
  8.     var generics = {
  9.         'Array': ["concat", "indexOf", "join", "lastIndexOf", "pop", "push", "reverse", "shift", "slice", "sort", "splice", "toString", "unshift", "valueOf"],
  10.         'String': ["charAt", "charCodeAt", "concat", "indexOf", "lastIndexOf", "match", "replace", "search", "slice", "split", "substr", "substring", "toLowerCase", "toUpperCase", "valueOf"]
  11.     };
  12.     for (var g in generics){
  13.         for (var i = generics[g].length; i--;) Native.genericize(natives[g], generics[g][i], true);
  14.     }
  15. })();

Lo probe con un alert y no ocurre nada.. gracias por las aclaraciones
Código Javascript:
Ver original
  1. (function(){ alert('a') })
__________________
Juegos
Juegos iphone
  #2 (permalink)  
Antiguo 23/07/2010, 12:32
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 15 años, 6 meses
Puntos: 1485
Respuesta: llamado extraño funcion (funcion(){})

no ocurre nada porque no estas invocando la funcion. vamos por parte. si separamos el codigo en varias lineas lo podemos ver con mas claridad.
Código:
(
function(){ // declaracion de la funcion;
// cuerpo;
}
)() 
en negrita tienes la declaracion de la funcion. en rojo un par de parentesis que envuelve la funcion. y en verde tienes la parte que has omitido, la invocacion de la funcion.

ahora la explicacion. en javascript hay tres formas de crear funciones: con el constructor Function, sentencia function (function statement), y el literal function. estos ultimos dos difieren un poco. se le dice function statement cuando la funcion tiene nombre, y se le dice funcion literal cuando es una funcion anonima. ejemplo.
Código:
// function statement;
function fn(){}

// funcion anonima;
var fn = function(){};
entonces, fijate en el codigo que tienes duda, dentro de los parentesis rojos tienes una funcion literal. la razon por la que se envuelve en un par de parentesis es porque dicha funcion no esta pensada para ser almacenada en una variable como en el ejemplo que mostre. pero no solo eso, sino que su intencion tambien es invocarla. de nada vale crear una función literal, no almacenarla en variable y encima tampoco invocarla. porque de lo contrario el interprete -aunque crea la función- al final la desecha. entonces, ¿que sucede si invocamos la funcion sin el par de parentesis? simplemente javascript genera error de sintaxis, creo porque no hay un contenedor para la funcion. ese es el proposito de envolver la funcion en un par de parentesis. igual como en la algebra, los parentesis se solucionan primeros, y eso es lo que hace javascript. al los parentesis tener mayor prioridad, primero se crea la funcion antes de invocarla. sin embargo, -como dato extra- hay algo curioso. si en lugar de envolverlo en parentesis, defines una variable, no crea error. supongo que este ultimo funciona porque la variable funciona como contenedor de la funcion momentaneamente de forma temporera. luego la variable contiene lo devuelto por la función. o sea,
Código:
// sin envolver en parentesis e invocar, genera error;
function(){}();

// invocar con asignacion en variable;
var fn = function(){}();

// funcion envuelta en parentesis e invocar;
(function(){})();
finalmente, ¿que proposito tiene no almacenar la funcion literal en una variable? la mayoria de las veces es una tecnica de encapsulacion. o sea, "ocultar" variables, funciones, u objetos para que estos no sean modificados desde el exterior y solo desde unas funciones especificas.

@edit, he agregado algún detalle superficial pero que también pueden ayudar en la comprensión. marcados en italico.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.

Última edición por zerokilled; 26/07/2010 a las 13:21 Razón: agregar detalle extra para futuros lectores...
  #3 (permalink)  
Antiguo 23/07/2010, 12:41
Avatar de Adler
Colaborador
 
Fecha de Ingreso: diciembre-2006
Mensajes: 4.671
Antigüedad: 17 años, 10 meses
Puntos: 126
Respuesta: llamado extraño funcion (funcion(){})

Hola

No puedo explicarte mucho, solo se que es una función anónima
Prueba con esto
Código Javascript:
Ver original
  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function ValoresP() {
  5. var ref = document.getElementById("contenedor").getElementsByTagName("p");
  6. for (var i = 0; i < ref.length; i++) {
  7. (function(){
  8. var elemento = ref[i];
  9. var nomevento = "click";
  10. var funcion = function() {
  11. alert(document.getElementById(this.id).innerHTML)
  12. }
  13.  
  14.       if (elemento.attachEvent)
  15.       {
  16.           var f=function(){
  17.             funcion.call(elemento,window.event);
  18.         }
  19.         elemento.attachEvent('on'+nomevento,f);
  20.         return true;
  21.       }
  22.       else  
  23.         if (elemento.addEventListener)
  24.         {
  25.           elemento.addEventListener(nomevento,funcion,false);
  26.           return true;
  27.         }
  28.        else
  29.           return false;
  30.     })()
  31.     }
  32.  
  33. }
  34.  
  35. window.onload = function(){ValoresP();};
  36. </script>
  37. </head>
  38. <body>
  39. <div id="contenedor">
  40. <p id="p1">Primer párrafo</p>
  41. <p id="p2">Segundo párrafo</p>
  42. </div>
  43. </body>
  44. </html>

Edito: @ZK cosas que pasan. Menos mal que tu lo explicas
Suerte
__________________
Los formularios se envían/validan con un botón Submit
<input type="submit" value="Enviar" style="background-color:#0B5795; font:bold 10px verdana; color:#FFF;" />
  #4 (permalink)  
Antiguo 23/07/2010, 23:35
 
Fecha de Ingreso: septiembre-2009
Ubicación: Neuquén
Mensajes: 142
Antigüedad: 15 años, 1 mes
Puntos: 12
Respuesta: llamado extraño funcion (funcion(){})

Llama a la función anónima al ejecutar el script, algo así como una manera más rápida...

Normalmente lo harias así:
Código Javascript:
Ver original
  1. function foo() {
  2.     alert('foo');
  3. }
  4.  
  5. foo();

Que es igual a hacer eso, pero como una función anónima:
Código Javascript:
Ver original
  1. (function() {
  2.     alert('foo');
  3. })();

Ya que estás definiendo y llamando a foo(), por decirlo de una forma...

Incluso se pueden pasar argumentos:
Código Javascript:
Ver original
  1. (function(foo) {
  2.     alert(foo);
  3. })('foo');

No se como más explicar :P

¡Saludos!
  #5 (permalink)  
Antiguo 26/07/2010, 12:26
Avatar de minkweb  
Fecha de Ingreso: septiembre-2005
Mensajes: 443
Antigüedad: 19 años, 2 meses
Puntos: 14
Respuesta: llamado extraño funcion (funcion(){})

Que pena con ustedes, pero no entendi, ¿Como puedo tener acceso a lo que esta dentro de esa funcion? el alert no se ejecuta, entoncs como es eso de "la mayoria de las veces es una tecnica de encapsulacion. o sea, "ocultar" variables, funciones, u objetos para que estos no sean modificados desde el exterior y solo desde unas funciones especificas. "..

Gracias a todos por sus respuestas
__________________
Juegos
Juegos iphone
  #6 (permalink)  
Antiguo 26/07/2010, 12:53
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 15 años, 6 meses
Puntos: 1485
Respuesta: llamado extraño funcion (funcion(){})

Cita:
[...] ¿Como puedo tener acceso a lo que esta dentro de esa funcion? el alert no se ejecuta, [...]
eso ya te lo explique en la respuesta anterior. te falto invocar esa funcion. fijate en el esquema colorido que mostre y lo comentado, te falto un par de parentesis (señalado en verde) para invocar dicha función.
Código:
(function(){ alert('a') })();
Cita:
[...] como es eso de "la mayoria de las veces es una tecnica de encapsulacion [...]
encapsulamiento es la tecnica de ocultar datos. en javascript, se logra mediante cierres o clausura (closure). basicamente trata de variables locales que son accesible desde una funcion que esta en el mismo alcance o ambito (scope) pero que esta funcion luego es devuelta a un entorno exterior. por ejemplo.
Código:
var bar = (function(){
var foo;
return {setFoo: function(value){return foo = value;},
getFoo: function(){return foo;}};
})();

alert(bar.getFoo()) // muestra undefined, aun no contiene valor;
bar.setFoo("minkweb");
alert(bar.getFoo()); // muestra "minkweb";
esta funcion envuelta en el par de parentesis crea la variable local foo, y luego devuelve un objeto literal que contiene dos funciones: setFoo y getFoo. setFoo asigna un valor a la variable foo pasado como argumento, mientras getFoo devuelve el valor contenido en la variable foo. ahora, ¿como puedes accesar a foo sin usar ninguna de estas funciones? la respuesta es no se puede porque es una variable local de otra funcion, y las variables locales no son accesible fuera de su entorno. por tanto, no hay forma de modificar la variable sino con funciones especificamente provistas para tal efecto.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.

Última edición por zerokilled; 26/07/2010 a las 13:01
  #7 (permalink)  
Antiguo 26/07/2010, 12:56
Avatar de Adler
Colaborador
 
Fecha de Ingreso: diciembre-2006
Mensajes: 4.671
Antigüedad: 17 años, 10 meses
Puntos: 126
Respuesta: llamado extraño funcion (funcion(){})

Hola

Se te han dado ejemplos e incluso @zerokilled se ha parado ha darte un explicación detallada y entendible, así que eso me lleva a pensar que lo que quieres es que hagamos que esa función te funcione, valga la redundancia. No creo que nadie se pare ha hacerlo

otro ejemplo

Suerte
__________________
Los formularios se envían/validan con un botón Submit
<input type="submit" value="Enviar" style="background-color:#0B5795; font:bold 10px verdana; color:#FFF;" />
  #8 (permalink)  
Antiguo 27/07/2010, 13:17
Avatar de minkweb  
Fecha de Ingreso: septiembre-2005
Mensajes: 443
Antigüedad: 19 años, 2 meses
Puntos: 14
Respuesta: llamado extraño funcion (funcion(){})

Yo no necesito ninguna funcion, solo busco aprender y resolver dudas ¿Si no lo entiendo a la primera es malo? lo siento, no me percate cuando vi las instrucciones de @zerokill
Cita:
y en verde tienes la parte que has omitido, la invocacion de la funcion.
muchas gracias a todos, ya comprendi como hacer ese llamado

Gracias
Saludos

__________________
Juegos
Juegos iphone

Etiquetas: extraño, funcion, llamado
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:13.