Explicar sobre IIFE en JavaScript

En este artículo, aprenderá acerca de las expresiones de funciones de invocación inmediata de JavaScript (IIFE). Una expresión de función JavaScript inmediatamente invocada es una función definida como una expresión y ejecutada inmediatamente después de la creación. A continuación se muestra la sintaxis para definir una expresión de función invocada inmediatamente.

Sintaxis:

(function(){
    // Function Body goes here
})();

Los IIFE también se pueden usar con funciones de flecha como se muestra a continuación.

(() => {
    // Function Body goes here
})()

Ahora que entendemos qué es exactamente un IIFE, intentemos comprender algunas de las situaciones en las que podríamos necesitar usar IIFE o funciones autoejecutables.

Casos de uso común de IIFE

1. Evitar la contaminación del contexto de ejecución global:

Se puede utilizar una función anónima inmediatamente invocada para el código de inicialización. Hay variables necesarias para configurar el entorno que luego ya no se usa y no debe saturar el espacio de nombres. Si conoce los contextos de ejecución en javascript, debe conocer el concepto de alcance global. Cualquier variable o función que esté presente en el ámbito global es accesible en cualquier parte de todo el programa. Pero a veces necesitamos asegurarnos de que esas variables no sean accesibles solo para partes específicas del programa. 

Por ejemplo: considere que está escribiendo una biblioteca y para la parte funcional va a usar nombres de variables que sean fáciles de entender y que coincidan con el contexto para el que necesita usarlos. Pero en una biblioteca, no querría obligar a ningún otro desarrollador a usar un nombre diferente solo porque está usando un nombre de variable en el código de la biblioteca. Desea asegurarse de que cualquier código existente (o nuevo) no interfiera accidentalmente con otras variables o anule funciones y métodos. La forma de asegurarse de que tales accidentes no sucedan es envolver todo su código dentro de un IIFE. Esta es la razón por la que muchas bibliotecas escriben su código fuente al estilo IIFE. 

Ejemplo:

<script>
  
    let firstVariable = "Hello";
    (() => {
        // Some initiation code
        let secondVariable = "Geeks";
    })();
  
    // The secondVariable will 
    // be discarded after the function is executed
    console.log("First Variable:", firstVariable)
    console.log("Second Variable:", secondVariable)
</script>

Producción:

First Variable: Hello
Uncaught ReferenceError: secondVariable is not defined

2. Para hacer que las variables sean privadas:

Los IIFE también son útiles para establecer métodos privados para funciones accesibles y al mismo tiempo exponer algunas propiedades para su uso posterior.

Ejemplo:

const User = (() => {
  
    let userName = "Geek";
    let userSecret = "Likes using IIFE";
    return {
        getName: () => userName,
        getSecret: () => userSecret
    }
})();
  
console.log(User.getName()); // returns "Geek"
console.log(User.getSecret()); // returns "Likes using IIFE"
console.log(User.userName); // returns undefined

Salida: En el ejemplo anterior, podemos acceder fácilmente a los métodos get que nos devuelven las funciones, pero no podemos acceder a ninguna propiedad que esté definida dentro de la función. Muchas bibliotecas de JavaScript siguen un patrón similar.

Geek
Likes using IIFE
undefined

Conclusión: es posible que un IIFE no se use mucho en proyectos de codificación regulares, pero es una de esas cosas que existen y tiene casos prácticos de uso en el mundo real. Es posible que se encuentre creando proyectos que podrían ser utilizados por otros desarrolladores y conceptos como IIFE definitivamente serán útiles. También puede encontrar algunos proyectos de código abierto que utilizan ampliamente conceptos como cierres, IIFE, curry de funciones, composición y muchos más. Estos conceptos son el corazón de la programación funcional y javascript, por lo que conocer estos temas definitivamente lo ayudará en su viaje de aprendizaje de JavaScript.