¿Cuál es el propósito de un auto función de la ejecución de Javascript?

Question

En Javascript, cuando usted quiera usar esto:

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

sobre esto:

//Bunch of code...

Answer 1

Todo es cuestión de alcance variable. Las variables declaradas en la función de auto ejecución son, por defecto, sólo está disponible con el código dentro de la función auto de ejecución. Esto permite que el código se escribe sin la preocupación de cómo las variables se denominan en otros bloques de código javascript.

Por ejemplo:

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

alert(foo); 

Esto primera alerta "3" y luego tirar un error en la siguiente alerta porque foo no está definido.

Answer 2

simplista. Así que lo más normal buscando, es casi reconfortante:

var userName = "Sean";

console.log(name());

function name() {
  return userName;
}

Sin embargo. Lo que si incluyo una biblioteca javascript realmente útil a mi página que se traduce caracteres avanzados en sus representaciones de nivel de base?

Espera ... ¿qué?

Me refiero. Si alguien escribe un personaje con algún tipo de acento en él (como un personaje francés o español), sino que sólo quieren caracteres 'Inglés'? A-z en mi programa? Bueno ... La española 'n ~' y los personajes franceses e / '(He usado dos caracteres cada uno de ellos, pero es probable que puedo dar el salto mental en el personaje que representa los acentos), los personajes pueden ser traducidos en caracteres base de 'n' y 'e'.

Así que alguien agradable persona ha escrito un convertidor integral carácter por ahí que puedo incluir en mi sitio ... lo incluyo.

Uno de los problemas:. Tiene una función, que se llama 'nombre' misma que mi función

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

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

La única forma de código en javascript alcance es de 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;
  }
}

Esto puede resolver nuestro problema. Ahora todo está cerrado y sólo se puede acceder desde dentro de nuestras llaves de apertura y cierre.

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

Sólo hay un problema. Nuestro código no funciona. Nuestra variable userName Nunca se hizo eco en la consola!

Podemos resolver este problema mediante la adición de 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 de 'principal' no se ha utilizado todavía? ... muy, muy delgada.

Necesitamos más alcance. Y alguna forma de ejecutar automáticamente nuestra función main ().

Ahora llegamos a las funciones de auto-ejecución (o de aplicación directa, autoejecutables, lo que sea).

(() {}) ();

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

Al enrollar una definición de función entre paréntesis, e incluir una lista de parámetros (otro conjunto o paréntesis!) Que actúa como una función llamada .

Así que vamos a mirar a nuestro código de nuevo, con una sintaxis de aplicación directa:

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

    console.log(name());

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

Así que, en la mayoría de los tutoriales que lee, ahora se bombardean con el término 'autoejecutable anónima' o algo similar.

Después de muchos años de desarrollo profesional, I muy que instan a nombre de cada función se escribe para fines de depuración.

Cuando algo va mal (y lo hará), se le mirando la traza en su navegador. Es siempre más fácil de obtener mejores temas de código cuando las entradas en el seguimiento de la pila tienen nombres!

Enormemente largo aliento y espero que ayude!

Answer 3

  

Auto-invocación (también conocido como   auto-invocación) es cuando una función   ejecuta inmediatamente después de su   definición. Este es un patrón de núcleo y   sirve como la base para muchos   otros patrones de JavaScript   desarrollo.

Soy un gran fan de ella :) porque:

• Se mantiene a un mínimo código
• Es cumplir separación de comportamiento de la presentación
• Proporciona un cierre que evita los conflictos de nombres

Enormemente - (¿Por qué se debe decir que es buena)

• Se trata de definir y ejecutar una función a la vez.
• Usted podría tener esa función autoejecutable devuelve un valor y pasar a la función como un parámetro a otra función.
• Es bueno para la encapsulación.
• También es bueno para el bloque de alcance.
• Sí, se puede adjuntar todos los archivos .js en una función automática y puede prevenir la contaminación del espacio de nombres global. ;)

aquí .

Answer 4

namespacing. ámbitos de JavaScript son función de nivel.

Answer 5

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

La construcción (function(){})() no protege contra globales implícitas, que para mí es la preocupación más grande, ver http://yuiblog.com/blog/2006/06/01/global-domination/

Básicamente, el bloque de función se asegura de todos los dependientes "vars globales" que define están confinados a su programa, no lo protegen contra la definición de variables globales implícitos. JSHint o similar puede proporcionar recomendaciones sobre la manera de defenderse contra este comportamiento.

La sintaxis var App = {} más concisa proporciona un nivel de protección similar, y puede ser envuelto en el bloque de función cuando en las páginas 'públicas'. (Ver Ember.js o SproutCore para ver ejemplos del mundo real de las bibliotecas que utilizan esta construcción)

En cuanto a las propiedades private van, que son una especie de sobrevalorado menos que esté creando un marco pública o la biblioteca, pero si usted necesita para ponerlos en práctica, Douglas Crockford tiene algunas buenas ideas.

Answer 6

¿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 es utilizada por la función asignada a a. something podría tener algún valor variable (por bucle) y cada vez que una tiene una nueva función.

Answer 7

He leído todas las respuestas, algo muy importante que falta aquí , voy a besar. Hay 2 razones principales, por lo que necesito funciones anónimas de aplicación directa, o mejor dicho " Expresión función invocada Inmediatamente-(IIFE) ":

1. Una mejor gestión de espacio de nombres (Evitar la Contaminación Espacio de nombres -> JS Module)
2. Los cierres (Simulación de los miembros de clase privada, como se conoce a partir de programación orientada a objetos)

La primera de ellas se ha explicado muy bien. Para la segunda, por favor estudie 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 para MyClosureObject, aún más el resultado de invocar esa función . Sea consciente de () en la última línea.

Atención 2: ¿Qué es lo que, además, tiene que saber acerca de las funciones de Javascript es que las funciones internas reciben acceso a los parámetros y variables de las funciones, que se definen dentro.

Vamos a tratar algunos experimentos:

puedo conseguir 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 fijar un otro nombre y obtener el resultado esperado:

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

Editar: En el ejemplo anterior MyClosureObject está diseñado para ser utilizado sin la newprefix, por lo tanto, por convención, que no debería ser capitalizada.

Answer 8

Ámbito de aislamiento, tal vez. De manera que las variables dentro de la declaración de función no contaminan el espacio de nombres externo.

Por supuesto, en la mitad de las implementaciones de JS por ahí, que de todas formas.

Answer 9

Esto es un sólido ejemplo de cómo un auto invocación de función anónima 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 10

Una de las diferencias es que las variables que se declaran en la función son locales, por lo que desaparece al salir de la función y la no entren en conflicto con otras variables en otro código.

Answer 11

Auto función invocada en javascript:

Una expresión auto-invocando se invoca (comenzó) de forma automática, sin ser llamado. Una expresión de auto-invocación se invoca justo después de su creación. Esto se utiliza básicamente para evitar conflicto 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) utilizar siempre la función ejecutada auto.

Answer 12

Dado que las funciones en Javascript son objeto de primera clase, mediante la definición de esa manera, que define eficazmente una "clase" mucho como C ++ o C #.

Esa función puede definir variables locales, y tienen funciones dentro de ella. Las funciones internas (efectivamente métodos de instancia) tendrán acceso a las variables locales (efectivamente variables de instancia), pero serán aislados del resto de la secuencia de comandos.

Answer 13

Auto función de ejecución, se utiliza para administrar el alcance de una variable.

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

Una variable global tiene alcance mundial; se define por todas partes en su código JavaScript y se puede acceder desde cualquier lugar dentro de la escritura, incluso en sus funciones. Por otro lado, las variables declaradas dentro de una función se definen sólo dentro del cuerpo de la función. Ellos son variables locales, tiene alcance local y sólo se puede acceder dentro de esa función. parámetros de la función también cuentan como variables locales y se definen sólo dentro del cuerpo de la función.

Como se muestra a continuación, se puede acceder a la variable GLOBALVariable dentro de su función y tener en cuenta 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 auto ejecución permite que el código se escribe sin la preocupación de cómo las variables se denominan en otros bloques de código javascript.

Answer 14

Parece que esta pregunta ha sido contestada todo listo, pero voy a publicar mi entrada de todos modos.

Sé que cuando me gusta usar las funciones de aplicación inmediata.

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

La función me permite utilizar un código extra para definir los atributos y propiedades childObjects de código más limpio, tales como la definición de las variables de uso común o la ejecución de ecuaciones matemáticas; Oh! o la comprobación de errores. en lugar de limitarse a la sintaxis de instancias de objeto anidado de ...

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

Codificación, en general, tiene una gran cantidad de formas oscuras de hacer muchas de las mismas cosas, por lo que se pregunta, "¿Por qué molestarse?" Pero las nuevas situaciones siguen apareciendo en el que ya no se puede confiar en los principios básicos / núcleo por sí solos.

Answer 15

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

En realidad, la función anterior será tratado como expresión de función sin nombre.

El objetivo principal de envolver una función con paréntesis de cierre y abierta es para no contaminar el espacio global.

Las variables y funciones dentro de la expresión de la función se convirtieron en privado (es decir) que no estarán disponibles fuera de la función.

Answer 16

IIRC que le permite crear propiedades y métodos privados.