valor - sintaxis de javascript

¿Cuál es el propósito de una función de auto ejecución en javascript?

Question

En javascript, ¿cuándo querrías usar esto?

(function(){
    //Bunch of code...
})();

Más allá de esto:

//Bunch of code...

Answer 1

La autoinvocación (también conocida como autoinvocación) es cuando una función se ejecuta inmediatamente después de su definición. Este es un patrón central y sirve de base para muchos otros patrones de desarrollo de JavaScript.

Soy un gran fan :) de eso porque:

• Mantiene el código al mínimo.
• Hace cumplir la separación del comportamiento de la presentación.
• Proporciona un cierre que evita conflictos de nombres.

Enormemente - (¿Por qué deberías decir que es bueno?)

• Se trata de definir y ejecutar una función a la vez.
• Podría hacer que esa función autoejecutable devuelva un valor y pase la función como parámetro a otra función.
• Es bueno para la encapsulación.
• También es bueno para el alcance del bloque.
• Sí, puede incluir todos sus archivos .js en una función de ejecución automática y puede evitar la contaminación global del espacio de nombres. ;)

Más here .

Answer 2

¿Hay un parámetro y el "montón de código" devuelve una función?

var a = function(x) { return function() { document.write(x); } }(something);

Cierre. El valor de something se usa por la función asignada a. something podría tener un valor variable (para el bucle) y cada vez que tiene una nueva función.

Answer 3

Aislamiento del alcance, tal vez. Para que las variables dentro de la declaración de función no contaminen el espacio de nombres externo.

Por supuesto, en la mitad de las implementaciones de JS, de todos modos lo harán.

Answer 4

Dado que las funciones en Javascript son objetos de primera clase, al definirlas de esa manera, define efectivamente una "clase" como C ++ o C #.

Esa función puede definir variables locales y tener funciones dentro de ella. Las funciones internas (métodos de instancia efectiva) tendrán acceso a las variables locales (variables de instancia efectiva), pero estarán aisladas del resto del script.

Answer 5

Espacio de nombres. Los ámbitos de JavaScript son a nivel de función.

Answer 6

Este es un ejemplo sólido de cómo una función anónima que invoca a uno mismo podría ser útil.

for( var i = 0; i < 10; i++ ) {
  setTimeout(function(){
    console.log(i)
  })
}

Salida: 10, 10, 10, 10, 10...

for( var i = 0; i < 10; i++ ) {
  (function(num){
    setTimeout(function(){
      console.log(num)
    })
  })(i)
}

Salida: 0, 1, 2, 3, 4...

Answer 7

He leído todas las respuestas, aquí falta algo muy importante , me BESO. Hay 2 razones principales por las que necesito funciones anónimas autoejecutables, o mejor dicho " Expresión de función invocada de inmediato (IIFE) ":

1. Mejor gestión del espacio de nombres (Evitar la contaminación del espacio de nombres -> Módulo JS)
2. Cierres (simulando miembros de clase privada, como se conoce de OOP)

El primero se ha explicado muy bien. Para la segunda, por favor estudia el siguiente ejemplo:

var MyClosureObject = (function (){
  var MyName = ''Michael Jackson RIP'';
  return {
    getMyName: function () { return MyName;},
    setMyName: function (name) { MyName = name}
  }
}());

Atención 1: No estamos asignando una función a MyClosureObject , más aún el resultado de invocar esa función . Sé consciente de () en la última línea.

Atención 2: lo que adicionalmente debe saber acerca de las funciones en Javascript es que las funciones internas tienen acceso a los parámetros y variables de las funciones, están definidas dentro.

Probemos algunos experimentos:

Puedo obtener MyName usando getMyName y funciona:

 console.log(MyClosureObject.getMyName()); 
 // Michael Jackson RIP

El siguiente enfoque ingenuo no funcionaría:

console.log(MyClosureObject.MyName); 
// undefined

Pero puedo establecer otro nombre y obtener el resultado esperado:

MyClosureObject.setMyName(''George Michael RIP'');
console.log(MyClosureObject.getMyName()); 
// George Michael RIP

Edición: en el ejemplo anterior, MyClosureObject está diseñado para ser utilizado sin el new prefijo, por lo tanto, por convención, no debe estar en mayúsculas.

Answer 8

IIRC te permite crear propiedades y métodos privados.

Answer 9

La función de auto ejecución se utiliza para administrar el alcance de una variable.

El alcance de una variable es la región de su programa en la que se define.

Una variable global tiene alcance global; Se define en todas partes en su código JavaScript y se puede acceder desde cualquier lugar dentro del script, incluso en sus funciones. Por otro lado, las variables declaradas dentro de una función se definen solo dentro del cuerpo de la función. Son variables locales, tienen un alcance local y solo se puede acceder a ellas dentro de esa función. Los parámetros de la función también cuentan como variables locales y se definen solo dentro del cuerpo de la función.

Como se muestra a continuación, puede acceder a la variable de variable global dentro de su función y también observar que dentro del cuerpo de una función, una variable local tiene prioridad sobre una variable global con el mismo nombre.

var globalvar = "globalvar"; // this var can be accessed anywhere within the script

function scope() {
    alert(globalvar);
    localvar = "localvar" //can only be accessed within the function scope
}

scope(); 

Así que, básicamente, una función de ejecución automática permite que el código se escriba sin tener en cuenta cómo se nombran las variables en otros bloques de código javascript.

Answer 10

No puedo creer que ninguna de las respuestas mencione globales implícitas.

La construcción (function(){})() no protege contra globales implícitos, lo que para mí es la mayor preocupación, consulte http://yuiblog.com/blog/2006/06/01/global-domination/

Básicamente, el bloque de funciones garantiza que todos los "vars globales" dependientes que definió estén confinados a su programa, no lo protege contra la definición de globales implícitos. JSHint o similares pueden proporcionar recomendaciones sobre cómo defenderse contra este comportamiento.

La sintaxis var App = {} más concisa, proporciona un nivel de protección similar y puede incluirse en el bloque de función cuando se encuentra en páginas ''públicas''. (vea Ember.js o SproutCore para ver ejemplos de bibliotecas en el mundo real que usan este constructo)

En cuanto a private propiedades private , están sobrevaloradas a menos que esté creando un marco público o una biblioteca, pero si necesita implementarlas, Douglas Crockford tiene algunas buenas ideas.

Answer 11

Parece que esta pregunta ya ha sido respondida lista, pero de todos modos publicaré mi opinión.

Sé cuándo me gusta usar funciones autoejecutables.

var myObject = {
    childObject: new function(){
        // bunch of code
    },
    objVar1: <value>,
    objVar2: <value>
}

La función me permite usar un código adicional para definir los atributos y propiedades de los childObjects para un código más limpio, como establecer variables de uso común o ejecutar ecuaciones matemáticas; Oh! o comprobación de errores. en lugar de limitarse a la sintaxis de instanciación de objetos anidados de ...

object: {
    childObject: {
        childObject: {<value>, <value>, <value>}
    }, 
    objVar1: <value>,
    objVar2: <value>
}

La codificación en general tiene muchas formas oscuras de hacer muchas de las mismas cosas, haciéndote preguntarte: "¿Por qué molestarse?" Pero siguen apareciendo nuevas situaciones en las que ya no se puede confiar solo en los principios básicos / básicos.

Answer 12

Se trata de alcance variable. Las variables declaradas en la función de ejecución automática están, de forma predeterminada, solo disponibles para el código dentro de la función de ejecución automática. Esto permite escribir código sin preocuparse de cómo se nombran las variables en otros bloques de código javascript.

Por ejemplo:

(function(){ 
    var foo = 3; 
    alert(foo); 
})(); 

alert(foo); 

Esto primero alertará "3" y luego generará un error en la siguiente alerta porque foo no está definido.

Answer 13

Simplista. De aspecto muy normal, es casi reconfortante:

var userName = "Sean";

console.log(name());

function name() {
  return userName;
}

Sin embargo. ¿Qué sucede si incluyo una biblioteca javascript realmente útil en mi página que traduce los personajes avanzados a sus representaciones de nivel base?

¿Esperar lo?

Quiero decir. ¿Si alguien escribe un carácter con algún tipo de acento (como un carácter francés o español) pero solo quiero caracteres "en inglés"? Az en mi programa? Bueno ... los caracteres en español ''n ~'' y francés ''e /'' (he usado dos caracteres para cada uno, pero probablemente puedas hacer el salto mental en el carácter que representa los acentos), esos caracteres se pueden traducir en caracteres base de ''n'' y ''e''.

Entonces, una persona agradable ha escrito un completo convertidor de caracteres que puedo incluir en mi sitio ... Lo incluyo.

Un problema: tiene una función llamada ''nombre'' igual que mi función.

Esto es lo que se llama colisión. Tenemos dos funciones declaradas en el mismo ámbito con el mismo nombre. Queremos evitar esto.

Así que tenemos que poner en alcance nuestro código de alguna manera.

La única forma de codificar el alcance en javascript es envolverlo en una función:

function main() {
  // We are now in our own sound-proofed room and the 
  // character-converter libarary''s name() function can exist at the 
  // same time as ours. 

  var userName = "Sean";

  console.log(name());

  function name() {
    return userName;
  }
}

Eso podría resolver nuestro problema. Ahora todo está cerrado y solo se puede acceder desde nuestras llaves de apertura y cierre.

Tenemos una función en una función ... que es extraño a la vista, pero totalmente legal.

Sólo un problema. Nuestro código no funciona. ¡Nuestra variable userName nunca se hace eco en la consola!

Podemos resolver este problema agregando una llamada a nuestra función después de nuestro bloque de código existente ...

function main() {
  // We are now in our own sound-proofed room and the 
  // character-converter libarary''s name() function can exist at the 
  // same time as ours. 

  var userName = "Sean";

  console.log(name());

  function name() {
    return userName;
  }
}

main();

¡O antes!

main();

function main() {
  // We are now in our own sound-proofed room and the 
  // character-converter libarary''s name() function can exist at the 
  // same time as ours. 

  var userName = "Sean";

  console.log(name());

  function name() {
    return userName;
  }
}

Una preocupación secundaria: ¿Cuáles son las posibilidades de que el nombre "principal" no se haya usado todavía? ... muy, muy delgado.

Necesitamos MÁS alcance. Y alguna forma de ejecutar automáticamente nuestra función main ().

Ahora llegamos a las funciones de ejecución automática (o autoejecutable, autoejecutable, lo que sea).

(() {}) ();

La sintaxis es torpe como el pecado. Sin embargo, funciona.

Cuando ajusta una definición de función entre paréntesis e incluye una lista de parámetros (¡otro conjunto o paréntesis!), Actúa como una llamada de función.

Así que veamos nuestro código de nuevo, con alguna sintaxis autoejecutable:

(function main() {
  var userName = "Sean";

    console.log(name());

    function name() {
      return userName;
    }
  }
)();

Entonces, en la mayoría de los tutoriales que lees, ahora serás bombardeado con el término ''ejecución automática anónima'' o algo similar.

Después de muchos años de desarrollo profesional, le recomiendo encarecidamente que nombre cada función que escribe para fines de depuración.

Cuando algo sale mal (y lo hará), verificará el retroceso en su navegador. ¡ Siempre es más fácil reducir los problemas de código cuando las entradas en el seguimiento de pila tienen nombres!

Con mucho viento y espero que ayude!

Answer 14

Una diferencia es que las variables que declara en la función son locales, por lo que desaparecen al salir de la función y no entran en conflicto con otras variables en otro código.

Answer 15

(function(){ var foo = { name: ''bob'' }; console.log(foo.name); // bob })(); console.log(foo.name); // Reference error

En realidad, la función anterior se tratará como expresión de función sin un nombre.

El propósito principal de envolver una función con paréntesis cerrado y abierto es evitar contaminar el espacio global.

Las variables y funciones dentro de la expresión de la función se volvieron privadas (es decir,) no estarán disponibles fuera de la función.

Answer 16

Función autoinvocada en javascript:

Una expresión de invocación automática se invoca (inicia) automáticamente, sin ser invocada. Se invoca una expresión de autoinvención justo después de su creación. Básicamente, esto se utiliza para evitar conflictos de nombres, así como para lograr la encapsulación. Las variables u objetos declarados no son accesibles fuera de esta función. Para evitar los problemas de minimización (filename.min), utilice siempre la función de ejecución automática.