Qué son las funciones anónimas de JavaScript

Resumen: en este tutorial, aprenderás sobre las funciones anónimas de JavaScript.

Introducción a las funciones anónimas de JavaScript

Una función anónima es una función sin nombre. A continuación, se muestra cómo definir una función anónima:

(function () {
   //...
});

Ten en cuenta que si no colocas la función anónima dentro de (), obtendrás un error de sintaxis. Los paréntesis () convierten a la función anónima en una expresión que devuelve un objeto de función.

No se puede acceder a una función anónima después de su creación inicial. Por lo tanto, a menudo necesitas asignarla a una variable.

Por ejemplo, lo siguiente muestra una función anónima que muestra un mensaje:

let show = function() {
    console.log('Soy una función anónima');
};

show();

En este ejemplo, la función anónima no tiene nombre entre la palabra clave function y los paréntesis ().

Debido a que necesitamos llamar a la función anónima más adelante, asignamos la función anónima a la variable show.

Dado que toda la asignación de la función anónima a la variable show constituye una expresión válida, no necesitas envolver la función anónima entre paréntesis ().

Usar funciones anónimas como argumentos

En la práctica, puedes pasar funciones anónimas como argumentos a otras funciones. Por ejemplo:

setTimeout(function() {
    console.log('Ejecutar después de 1 segundo')
}, 1000);

En este ejemplo, pasamos una función anónima a la función setTimeout(). La función setTimeout() ejecuta esta función anónima un segundo después.

Ten en cuenta que las funciones son ciudadanos de primera clase en JavaScript. Por lo tanto, puedes pasar una función a otra función como argumento.

Ejecución de función invocada inmediatamente

Si deseas crear una función y ejecutarla inmediatamente después de la declaración, puedes declarar una función anónima como esta:

(function() {
    console.log('EFII');
})();

Cómo funciona.

Primero, defines una expresión de función:

(function () {
    console.log('Ejecución de función invocada inmediatamente');
})

Esta expresión devuelve una función.

En segundo lugar, llama a la función agregando los paréntesis finales ():

(function () {
    console.log('Ejecución de función invocada inmediatamente');
})();

Pero, también es posible que desees pasarle argumentos, como este:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

(function () {
    console.log(person.firstName + ' ' + person.lastName);
})(person);

Funciones de flecha

ES6 introdujo expresiones de función de flecha que proporcionan una abreviatura para declarar funciones anónimas:

Por ejemplo, esta función:

let show = function () {
    console.log('Función anónima');
};

Se puede acortar usando la siguiente función de flecha:

let show = () => console.log('Función anónima');

Del mismo modo, la siguiente función anónima:

let add = function (a, b) {
    return a + b;
};

Es funcionalmente equivalente a la siguiente función de flecha:

let add = (a, b) => a + b;   

Resumen

• Las funciones anónimas son funciones sin nombres.
• Las funciones anónimas se pueden usar como argumento para otras funciones o como una ejecución de función invocada inmediatamente.