Una expresión de función invocada inmediatamente (o IIFE , pronunciada "iffy", IPA /ˈɪf.i/) es un modismo del lenguaje de programación que produce un alcance léxico utilizando el alcance de función . Fue popular en JavaScript [1] como un método para respaldar la programación modular antes de la introducción de soluciones más estandarizadas como CommonJS y los módulos ES . [2]
Las expresiones de función invocadas inmediatamente se pueden usar para evitar la elevación de variables desde dentro de bloques, proteger contra la contaminación del medio ambiente global y, simultáneamente, permitir el acceso público a los métodos mientras se conserva la privacidad de las variables definidas dentro de la función.
Las expresiones de función invocadas inmediatamente pueden escribirse de varias maneras diferentes. [3] Una convención común es encerrar la expresión de función (y opcionalmente su operador de invocación) con el operador de agrupación, [4] entre paréntesis, para indicarle al analizador explícitamente que espere una expresión. De lo contrario, en la mayoría de las situaciones, cuando el analizador encuentra la functionpalabra clave, la trata como una declaración de función (sentencia), y no como una expresión de función. [5] [6]
( function () { /* ... */ })(); ( function () { /* ... */ }()); (() => { /* ... */ })(); // Con funciones de flecha ES6 (aunque los paréntesis solo se permiten en el exterior) Hay otras formas de hacer cumplir una expresión de función: [ cita requerida ]
! función () { /* ... */ }(); ~ función () { /* ... */ }(); - función () { /* ... */ }(); + función () { /* ... */ }(); void función () { /* ... */ }(); eliminar función () { /* ... */ }(); tipo de función () { /* ... */ }(); esperar función () { /* ... */ }(); En contextos donde se espera una expresión, no es necesario encerrarla entre paréntesis:
sea f = función () { /* ... */ }(); verdadero && función () { /* ... */ }(); 0 , función () { /* ... */ }(); El paso de variables al ámbito se realiza de la siguiente manera:
( función ( a , b ) { /* ... */ })( "hola" , "mundo" ); Un paréntesis inicial es un caso en el que la inserción automática de punto y coma (ASI) en JavaScript puede causar problemas; la expresión se interpreta como una llamada al último término de la línea anterior. En algunos estilos que omiten los puntos y coma opcionales, el punto y coma se coloca delante del paréntesis y se conoce como punto y coma defensivo . [7] [8] Por ejemplo:
a = b + c ;( función () { // código })(); ...para evitar ser analizado como c().
La clave para entender patrones de diseño como IIFE es darse cuenta de que antes de ES6, JavaScript solo presentaba un alcance de función (por lo que carecía de alcance de bloque ), pasando valores por referencia dentro de cierres . [9] Esto ya no es así, ya que la versión ES6 de JavaScript implementa el alcance de bloque usando las nuevas palabras clave lety [10]const
La falta de alcance de bloque significa que las variables definidas dentro de (por ejemplo) un bucle for tendrán su definición "elevada" a la parte superior de la función que las contiene. Evaluar una función que depende de variables modificadas por la función externa (incluso por iteración) puede ser difícil. Podemos ver esto sin un bucle si actualizamos un valor entre la definición y la invocación de la función. [11]
sea v , obtenerValor ; v = 1 ; obtenerValor = función () { devolver v ; }; v = 2 ; obtenerValor (); // 2 Si bien el resultado puede parecer obvio cuando se actualiza vmanualmente, puede producir resultados no deseados cuando getValue()se define dentro de un bucle.
A partir de ahora la función pasa vcomo argumento y se invoca inmediatamente, preservando el contexto de ejecución de la función interna. [12]
sea v , obtenerValor ; v = 1 ; obtenerValor = ( función ( x ) { devolver función () { devolver x ; }; })( v ); v = 2 ; obtenerValor (); // 1 Esto es equivalente al siguiente código:
sea v , obtenerValor ; v = 1 ; función f ( x ) { devolver función () { devolver x ; }; }; obtenerValor = f ( v ); v = 2 ; obtenerValor (); // 1 Las IIFE también son útiles para establecer métodos privados para funciones accesibles y al mismo tiempo exponer algunas propiedades para su uso posterior. [13] El siguiente ejemplo proviene de la publicación de Alman sobre IIFE. [1]
// "counter" es una función que devuelve un objeto con propiedades, que en este caso son funciones. let counter = ( function () { let i = 0 ; retorna { obtener : función () { retorna i ; }, establecer : función ( val ) { i = val ; }, incrementar : función () { retorna ++ i ; } }; })(); // Estas llamadas acceden a las propiedades de la función devueltas por "counter". counter . get (); // 0 counter . set ( 3 ); counter . increment (); // 4 counter . increment (); // 5 Si intentamos acceder counter.idesde el entorno global, no estará definido, ya que está incluido dentro de la función invocada y no es una propiedad de counter. Del mismo modo, si intentamos acceder a i, se producirá un error, ya que no lo hemos declarado ien el entorno global.
Originalmente conocida como una "función anónima autoejecutable", [14] Ben Alman introdujo más tarde el término actual IIFE como un nombre semánticamente más preciso para el modismo, poco después de que surgiera su discusión en comp.lang.javascript. [1] [15] [16]
En particular, las funciones invocadas inmediatamente no necesitan ser anónimas de forma inherente, y el modo estricto de ECMAScript 5 prohíbe , [17] lo que hace que el término original sea un nombre inapropiado . arguments.callee