在本教程中,您将了解 JavaScript 匿名函数。
JavaScript 匿名函数简介
匿名函数是没有名称的函数。下面展示了如何定义一个简单的匿名函数:
(function () {
//...
});
请注意,如果您不将匿名函数放在()
中,则会出现语法错误。()
使匿名函数成为返回函数对象的表达式。
匿名函数在创建后不可访问。因此,您经常需要将其分配给一个变量。例如,下面展示一个打印消息的匿名函数:
let show = function() {
console.log('Anonymous function');
};
show();
在此示例中,匿名函数在关键字 function
和 ()
括号之间没有名称。因为后面需要调用匿名函数,所以我们把匿名函数赋值给 show
变量。
由于匿名函数对 show 变量的赋值构成一个有效的表达式,因此您无需将匿名函数括在括号 ()
中。
匿名函数作为参数
实际上,您经常将匿名函数作为参数传递给其他函数。例如:
setTimeout(function() {
console.log('Execute later after 1 second')
}, 1000);
在这个例子中,我们将一个匿名函数传递给函数 setTimeout()
。setTimeout()
函数在一秒钟后执行此匿名函数。
请注意,函数是 JavaScript 的一等公民。因此,您可以将一个函数作为参数传递给另一个函数。
IIFE 立即调用函数执行
如果你想创建一个函数并在声明后立即执行,你可以这样声明一个匿名函数:
(function() {
console.log('IIFE');
})();
代码是如何运行的。
首先,定义一个函数表达式,表达式返回一个函数。:
(function () {
console.log('Immediately invoked function execution');
})
其次,通过添加尾随括号 ()
来调用函数:
(function () {
console.log('Immediately invoked function execution');
})();
有时,您可能希望将参数传递给 IIFE 立即调用函数,如下所示:
let person = {
firstName: 'John',
lastName: 'Doe'
};
(function () {
console.log(person.firstName} + ' ' + person.lastName);
})(person);
箭头函数
ES6 引入了箭头函数表达式,为声明匿名函数提供了简写形式。例如,这个函数:
let show = function () {
console.log('Anonymous function');
};
...可以使用箭头函数缩短:
let show = () => console.log('Anonymous function');
同样,下面的匿名函数:
let add = function (a, b) {
return a + b;
};
...在功能上等同于以下箭头函数:
let add = (a, b) => a + b;
结论
- 匿名函数是没有名称的函数。
- 匿名函数可以用作其他函数的参数或作为立即调用的函数执行。