itemtype='https://schema.org/WebPage' itemscope='itemscope' class="page-template-default page page-id-1687 page-child parent-pageid-1563 ast-desktop ast-separate-container ast-right-sidebar astra-4.6.14 ast-single-post ast-inherit-site-logo-transparent ast-hfb-header ast-normal-title-enabled">

007. Funciones anónimas autoejecutables

Las funciones anónimas autoejecutables son funciones en la cual englobamos todo el código que queremos ejecutar. Este patrón fue muy utilizado porque creábamos una encapsulación de nuestro código, y se denominan anónimas autoejecutables porque no solamente las definimos, sino que las estamos ejecutando en el momento de crearlas, y como su nombre dice, no tienen nombre, es una manera de que en el momento de que nuestro archivo se cargue en el navegador, se ejecuta la programación que está en este archivo, y aparte está protegido de efectos secundarios que pudiera tener la invocación de librerías de terceros o de otras mismos archivos que hayamos creado, y que, por tener nombres de variables o funciones muy similares evitan todo esto.

Además, permite pasar parámetros de una manera mas amigable.

Una función con nombre se llama función nombrada, como pueden ser alert(), confirm(), prompt(). Una función que no tiene nombre y que se autoejecuta tiene la siguiente sintaxis:

(function(){
   // Aquí escribimos nuestro código a ejecutar
})();

Este es uno de los pocos casos en los que sí hay que poner punto y coma (;) al finalizar la función. Podemos incluir varias funciones anónimas autoejecutables, una después de la otra. De la siguiente manera.

Ejm

      // Sintaxis de función anónima autoejecutable

      (function () {
        console.log("Mi primera función anónima autoejecutable");
      })();

      (function () {
        console.log("Mi segunda función anónima autoejecutable");
      })();

El código de la primea IIFE no está entrando en conflicto con el código de la segunda.

Paso de parámetros

Veamos un ejm.

      (function (d, w, c) {
        console.log(d);
        console.log(w);
        console.log(c);
      })(document, window, console);

d sería el alias de document, w el alias de window, y c el alias de console, de manera que si tenemos que llamar a document lo podemos hacer a través del alias que hemos creado y ahorrar escribir texto.

Antes de que llegaran los módulos, es decir, poder mandar a llamar archivos Javascript dentro de otros y poder encapsular nuestro código a manera de métodos exportados e importados, este era un patrón muy utilizado a la hora de crear módulos en Javascript. Podemos ir al módulo de jQuery, el cual utiliza este patrón.

Formas de escribir una función anónima autoejecutable

Existen diferentes formas de escribir una IIFE. Las más conocidas son las siguientes:

1. Versión clásica

(function(){
   console.log("Versión clásica");
})();

2. Formato Crockford

Es el formato que propone Douglas Crockford, el creador del libro Javascript, The Good Parts. Es el creador del formato JSON.

((function(){
   console.log("Versión Crockford");
}())

3. Versión unaria

+function(){
   console.log("Versión unaria");
}()

4. Facebook

!function(){
   console.log("Versión Facebook");
}()
Scroll al inicio