JavaScript 匿名函数

摘要：在本教程中，您将了解 JavaScript 匿名函数，它们是无名的函数。

JavaScript 匿名函数简介

匿名函数是一个 函数，没有名称。以下是如何定义匿名函数

(function () {
   //...
});Code language: JavaScript (javascript)

请注意，如果您不将匿名函数放在括号 () 内，您将收到语法错误。括号 () 使匿名函数成为一个表达式，它返回一个函数对象。

匿名函数在其初始创建后不可访问。因此，您通常需要将其分配给一个变量。

例如，以下显示了一个显示消息的匿名函数

let show = function() {
    console.log('Anonymous function');
};

show();Code language: JavaScript (javascript)

在此示例中，匿名函数在 function 关键字和括号 () 之间没有名称。

因为我们需要稍后调用匿名函数，所以我们将匿名函数分配给 show 变量。

由于将匿名函数分配给 show 变量的整个赋值构成了一个有效的表达式，因此您不需要将匿名函数包装在括号 () 内。

使用匿名函数作为参数

在实践中，您经常将匿名函数作为参数传递给其他函数。例如

setTimeout(function() {
    console.log('Execute later after 1 second')
}, 1000);Code language: JavaScript (javascript)

在此示例中，我们将一个匿名函数传递到 setTimeout() 函数中。setTimeout() 函数在 1 秒后执行此匿名函数。

请注意，函数是JavaScript 中的一等公民。因此，您可以将函数作为参数传递给另一个函数。

立即调用函数执行

如果您想在声明后立即创建函数并执行它，您可以像这样声明匿名函数

(function() {
    console.log('IIFE');
})();Code language: JavaScript (javascript)

输出

IIFE

工作原理。

首先，定义一个函数表达式

(function () {
    console.log('Immediately invoked function execution');
})Code language: JavaScript (javascript)

此表达式返回一个函数。

其次，通过添加尾部括号 () 来调用函数

(function () {
    console.log('Immediately invoked function execution');
})();Code language: JavaScript (javascript)

有时，您可能想将参数传递到匿名函数中，像这样

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

(function () {
    console.log(person.firstName + ' ' + person.lastName);
})(person);Code language: JavaScript (javascript)

输出

John Doe

箭头函数

ES6 引入了 箭头函数 表达式，它为声明匿名函数提供了一种简写方式。

例如，此函数

let show = function () {
    console.log('Anonymous function');
};Code language: JavaScript (javascript)

…可以使用以下箭头函数缩写

let show = () => console.log('Anonymous function');Code language: JavaScript (javascript)

类似地，以下匿名函数

let add = function (a, b) {
    return a + b;
};Code language: JavaScript (javascript)

…在功能上等同于以下箭头函数

let add = (a, b) => a + b;   Code language: JavaScript (javascript)

总结

• 匿名函数是无名的函数。
• 使用匿名函数可以作为其他函数的参数或作为立即调用函数执行。