JavaScript 函数表达式详解：从基础到实践

JavaScript 函数表达式详解：从基础到实践

ru.javascript.info Современный учебник JavaScript 项目地址: https://gitcode.com/gh_mirrors/ru/ru.javascript.info

函数在 JavaScript 中的本质

在 JavaScript 中，函数不仅仅是语法结构，它们本质上是一种特殊类型的值。理解这一点是掌握 JavaScript 函数编程的关键。函数可以像其他值一样被赋值、传递和使用，这种特性为 JavaScript 提供了极大的灵活性。

函数声明 vs 函数表达式

JavaScript 提供了两种主要的函数定义方式：

1. 函数声明 (Function Declaration)

function sayHi() {
  console.log("你好");
}

特点：

• 以 function 关键字开头，后跟函数名
• 在代码执行前被解析（提升）
• 在整个包含它的作用域内都可见

2. 函数表达式 (Function Expression)

let sayHi = function() {
  console.log("你好");
};

特点：

• 函数作为表达式的一部分创建
• 可以匿名（没有函数名）
• 在执行流到达时才会创建
• 可以立即调用或赋值给变量

函数作为一等公民

JavaScript 中的函数是"一等公民"，这意味着：

1. 可以赋值给变量：

   let greet = function() { console.log("Hello") };
   greet(); // 调用函数
   

2. 可以作为参数传递：

   function ask(question, yesCallback, noCallback) {
     if (confirm(question)) yesCallback();
     else noCallback();
   }
   

3. 可以作为返回值：

   function createGreeter() {
     return function() { console.log("Welcome!") };
   }
   

回调函数模式

函数表达式最常见的用途之一是创建回调函数。回调函数是在某个操作完成后被调用的函数：

// 使用命名函数作为回调
function showOk() { console.log("你同意了"); }
function showCancel() { console.log("你取消了"); }
ask("你同意吗？", showOk, showCancel);

// 使用匿名函数表达式作为回调
ask(
  "你同意吗？",
  function() { console.log("你同意了"); },
  function() { console.log("你取消了"); }
);

函数表达式的高级用法

1. 立即调用函数表达式 (IIFE)

(function() {
  console.log("这个函数会立即执行");
})();

2. 条件函数定义

let greeting;
if (hour < 12) {
  greeting = function() { console.log("早上好"); };
} else {
  greeting = function() { console.log("下午好"); };
}

3. 使用箭头函数简化表达式

现代 JavaScript 中，可以使用箭头函数简化函数表达式：

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

何时使用函数声明 vs 函数表达式

使用函数声明的情况：

• 当函数是代码的主要组成部分时
• 当需要函数提升特性时
• 当函数需要被递归调用时（命名函数更清晰）

使用函数表达式的情况：

• 当需要条件性定义函数时
• 当函数作为回调参数传递时
• 当需要创建闭包时
• 当使用 IIFE 模式时

作用域差异

函数声明和函数表达式在作用域方面有重要区别：

1. 函数声明：

   • 在严格模式下，块级作用域内声明的函数只在该块内可见
   • 在非严格模式下，行为可能因浏览器而异

2. 函数表达式：

   • 遵循常规的变量作用域规则
   • 可以通过变量声明控制其可见性

最佳实践建议

1. 对于主要功能逻辑，优先使用函数声明
2. 对于回调、条件函数等场景，使用函数表达式
3. 在块级作用域内定义函数时，考虑使用函数表达式以避免意外行为
4. 保持代码风格一致，避免混用导致混淆

理解函数表达式和函数声明的区别，能够帮助开发者编写更清晰、更灵活的 JavaScript 代码，充分利用函数作为一等公民的特性来构建更强大的应用程序。

ru.javascript.info Современный учебник JavaScript 项目地址: https://gitcode.com/gh_mirrors/ru/ru.javascript.info