匿名函数(Anonymous Function)是 JavaScript 中一种没有名称的函数表达式。它们在多种场景下非常有用,特别是在需要一次性使用的函数或作为回调函数时。
基本语法
跳转到“基本语法”匿名函数的基本语法如下:
// 函数表达式形式const myFunction = function() { console.log('这是一个匿名函数');};
// 调用匿名函数myFunction();常见使用场景
跳转到“常见使用场景”1. 立即调用函数表达式 (IIFE)
跳转到“1. 立即调用函数表达式 (IIFE)”(function() { console.log('这个匿名函数会立即执行');})();2. 作为回调函数
跳转到“2. 作为回调函数”setTimeout(function() { console.log('1秒后执行');}, 1000);
// 数组方法中的回调const numbers = [1, 2, 3];const doubled = numbers.map(function(item) { return item * 2;});3. 箭头函数(也是匿名函数的一种)
跳转到“3. 箭头函数(也是匿名函数的一种)”ES6 引入的箭头函数是匿名函数的简洁写法:
const add = (a, b) => a + b;
// 等同于const add = function(a, b) { return a + b;};匿名函数的特点
跳转到“匿名函数的特点”- 没有函数名:无法通过名称直接引用
- 可以作为值传递:可以赋值给变量、作为参数传递或作为返回值
- 有自己的作用域:创建新的函数作用域
匿名函数 vs 命名函数
跳转到“匿名函数 vs 命名函数”// 命名函数function namedFunction() { console.log('我有名字');}
// 匿名函数const anonymousFunction = function() { console.log('我没有名字');};主要区别:
- 命名函数可以在定义前调用(函数提升)
- 匿名函数只能在定义后调用
- 命名函数在调用栈中更容易调试(会显示函数名)
实际应用示例
跳转到“实际应用示例”// 事件处理document.getElementById('myButton').addEventListener('click', function() { console.log('按钮被点击了');});
// 模块模式const counter = (function() { let count = 0;
return { increment: function() { count++; }, getCount: function() { return count; } };})();匿名函数是 JavaScript 编程中的重要概念,理解它们对于编写现代 JavaScript 代码至关重要。
来源:CSDN 原文,首次发布于 2025-03-30。