A logo showing the text blog.marcnuri.com
English
Inicio»JavaScript»¿Qué es una Immediately Invoked Function Expression (IIFE)?

Entradas Recientes

  • Fabric8 Kubernetes Client 7.2.0 está disponible!
  • Conectarse a un servidor MCP con JavaScript y AI SDK
  • Conectarse a un servidor MCP con JavaScript y LangChain.js
  • El Futuro de las Herramientas para Desarrolladores en la era de la IA
  • Conectarse a un servidor Model Context Protocol (MCP) con Java y LangChain4j

Categorías

  • Antiguo
  • Front-end
  • Go
  • Herramientas
  • Industria y negocios
  • Inteligencia Artificial
  • Java
  • JavaScript
  • Operaciones
  • Personal
  • Proyectos personales

Archivos

  • mayo 2025
  • abril 2025
  • marzo 2025
  • febrero 2025
  • enero 2025
  • diciembre 2024
  • noviembre 2024
  • agosto 2024
  • junio 2024
  • mayo 2024
  • abril 2024
  • marzo 2024
  • febrero 2024
  • enero 2024
  • diciembre 2023
  • noviembre 2023
  • octubre 2023
  • septiembre 2023
  • agosto 2023
  • julio 2023
  • junio 2023
  • mayo 2023
  • abril 2023
  • marzo 2023
  • febrero 2023
  • enero 2023
  • diciembre 2022
  • noviembre 2022
  • octubre 2022
  • agosto 2022
  • julio 2022
  • mayo 2022
  • marzo 2022
  • febrero 2022
  • enero 2022
  • diciembre 2021
  • noviembre 2021
  • octubre 2021
  • septiembre 2021
  • agosto 2021
  • julio 2021
  • diciembre 2020
  • octubre 2020
  • agosto 2020
  • junio 2020
  • mayo 2020
  • marzo 2020
  • febrero 2020
  • enero 2020
  • noviembre 2019
  • octubre 2019
  • julio 2019
  • diciembre 2018
  • agosto 2018
  • julio 2018
  • junio 2018
  • mayo 2018
  • marzo 2018
  • febrero 2018
  • noviembre 2017
  • octubre 2017
  • agosto 2017
  • julio 2017
  • enero 2017
  • julio 2016
  • enero 2016
  • diciembre 2015
  • noviembre 2015
  • diciembre 2014
  • marzo 2014
  • febrero 2011
  • junio 2008
  • mayo 2008
  • abril 2008
  • enero 2008
  • junio 2007
  • mayo 2007
  • abril 2007
  • marzo 2007

¿Qué es una Immediately Invoked Function Expression (IIFE)?

2011-02-19 en JavaScript etiquetado JavaScript / Frontend por Marc Nuri | Última actualización: 2025-01-28
English version

JavaScript, como lenguaje, ofrece una variedad de patrones y técnicas para estructurar y ejecutar código. Una de esas técnicas es la Immediately Invoked Function Expression (IIFE). Si alguna vez te has preguntado qué es una IIFE, cómo funciona y por qué existe, este post es para ti.

Los conceptos básicos de IIFE

Una Immediately Invoked Function Expression es una función de JavaScript que se ejecuta inmediatamente después de ser definida. La sintaxis general es tal que así:

(function() {
  // Code to be executed immediately
})();

La función se define y se ejecuta de inmediato. Se define dentro de un par de paréntesis (function() { ... }) para asegurarse de que se trate como una expresión en lugar de una declaración. El par de paréntesis () al final de la expresión se utilizan para invocar la función de inmediato.

Principales características de IIFE

  • Ejecución inmediata: La función se ejecuta tan pronto como el motor de JavaScript la encuentra.
  • Encapsulación y aislamiento: La función crea un ámbito privado, lo que ayuda a evitar la contaminación del ámbito global. Las variables declaradas dentro de la IIFE no son accesibles desde fuera de la función.
  • Módulos autocontenidos: Las IIFE pueden actuar como mini-módulos devolviendo objetos o funciones que mantienen un estado interno privado mientras exponen solo los métodos o valores elegidos.

¿Por qué usar un IIFE?

Los IIFE se utilizan comúnmente en JavaScript para:

1. Evitar variables globales

Las variables de JavaScript declaradas con var pueden potencialmente contaminar el espacio de nombres global. Una IIFE crea un nuevo ámbito, aislando las variables dentro de él del resto del código.

(function() {
    var message = "Hello, IIFE from blog.marcnuri.com!";
    console.log(message); // "Hello, IIFE!"
})();

console.log(typeof message); // "undefined"

En este ejemplo, la variable message no es accesible fuera del IIFE.

2. Crear variables privadas

Las IIFE son útiles para crear variables privadas y encapsular la lógica. Esto es particularmente útil al construir código modular.

var store = (function () {
    var items = [];

    return {
        addItem: function(item) {
            items.push(item);
        },
        getItem: function(index) {
            return items[index];
        },
        getItemCount: function() {
            return items.length;
        }
    };
})();

store.addItem("blog.marcnuri.com");
console.log(store.getItem(0)); // "blog.marcnuri.com"

Aquí, la variable items es privada y solo se puede acceder o modificar a través del objeto devuelto.

3. Ejecutar código de inicialización

Las IIFE son una forma útil y limpia de ejecutar código de configuración sin dejar variables o funciones temporales que ensucien el ámbito global.

(function() {
    console.log("blog.marcnuri.com initialized");
    // Perform setup tasks without polluting the global scope
})();

Casos de uso comunes para IIFE

  • Patrón de módulo: Las IIFE se utilizan a menudo para crear módulos en JavaScript. El ejemplo "Crear variables privadas" anterior demuestra esto.
  • Polyfills: Las IIFE se pueden utilizar para crear polyfills para navegadores antiguos.
    polyfill.js
    (function() {
      // Polyfill for Array.prototype.forEach
      if (!Array.prototype.forEach) {
        // Implementation of Array.prototype.forEach in case it doesn't exist
        Array.prototype.forEach = function(callback, thisArg) {
          for (var i = 0; i < this.length; i++) {
            callback.call(thisArg, this[i], i, this);
          }
        };
      }
    })();
  • Gestión de eventos: Las IIFE se pueden utilizar para crear lógica de manejo de eventos aislada.
    event-handler.js
    (function() {
      // Attach event listener to a button
      var blogButton = document.getElementById("blogButton");
      blogButton.addEventListener("click", function() {
        console.log("Button clicked!");
      });
    })();
  • Scripts de un solo uso: Las IIFE son útiles para ejecutar scripts de un solo uso que no necesitan ser reutilizados.
    one-time-script.js
    (function() {
      // One-time script to log a message
      console.log("This script runs only once and never again");
    })();

Conclusión

Las IIFEs son un patrón potente y versátil en JavaScript. Demuestran cómo la flexibilidad de JavaScript permite a los desarrolladores crear código limpio, modular y mantenible. Al utilizar IIFEs, puedes evitar la contaminación del ámbito global, crear variables privadas y ejecutar código de inicialización de forma limpia y concisa.

Referencias

  • Ben Alman: Immediately-Invoked Function Expression (IIFE)
  • MDN Web Docs: IIFE
  • Wikipedia: Immediately Invoked Function Expression
Twitter iconFacebook iconLinkedIn iconPinterest iconEmail icon

Navegador de artículos
¿Qué es un Heap Dump en Java?Windows XP: Cómo habilitar la cuenta de Administrador/Administrator
© 2007 - 2025 Marc Nuri