函数表达式和函数声明的区别(函数声明与表达式异)

函数表达式与函数声明是JavaScript中两种定义函数的核心方式，其差异涉及语法结构、执行上下文、变量提升、作用域绑定等多个维度。函数声明通过独立语句形式定义，具有变量提升特性，可在定义前调用；而函数表达式作为匿名函数赋值存在，需先解析变量再执行。两者在语法灵活性、作用域规则、执行时机等方面存在本质区别，直接影响代码的可维护性、调试难度及运行效率。例如，函数声明会优先于变量赋值被提升，而函数表达式需等待所在变量的声明阶段完成后才能访问。

核心差异综合对比表

对比维度	函数声明	函数表达式
语法形式	独立语句，以function开头	赋值语句，需配合变量名
变量提升	整个函数体被提升至上下文顶部	仅变量声明被提升，函数体不提升
调用时机	可在声明前调用	需等待变量解析后才能调用
匿名性	必须具名（名称可选但推荐）	可定义为匿名函数
作用域绑定	绑定至当前作用域（全局/函数）	受变量声明位置的作用域限制

一、语法结构与定义形式

函数声明采用独立的function关键字语法，名称可省略但建议保留，例如：

function add(a, b)  return a + b; 

而函数表达式需通过赋值操作绑定到变量或属性，例如：

const subtract = function(a, b)  return a - b; ;

函数声明可视为语句级定义，而表达式属于值赋值，后者允许更灵活的语法嵌套，如立即执行函数表达式（IIFE）。

二、变量提升机制差异

函数声明会在当前作用域顶部进行完整提升，例如：

console.log(add(2, 3)); // 输出5
function add(a, b)  return a + b; 

而函数表达式仅提升变量声明，函数体需等待赋值完成后方可访问：

console.log(subtract); // 输出undefined
const subtract = function(a, b)  return a - b; ;

此差异导致函数声明可安全前置调用，而表达式需严格遵循代码执行顺序。

三、作用域与命名规则

特性	函数声明	函数表达式
作用域绑定	绑定至声明位置的作用域（如全局/函数）	受变量所在作用域约束（如块级作用域）
匿名性支持	必须具名（名称用于提升和递归）	可定义匿名函数（如赋值给变量）
递归调用	直接支持（名称在提升后可用）	需通过变量名间接调用

例如，函数声明可通过名称直接递归调用，而表达式需依赖变量引用：

function factorial(n)  return n === 0 ? 1 : n  factorial(n-1); 

const fib = function(n)  return n <= 1 ? n : fib(n-1) + fib(n-2); ;

四、执行上下文与内存管理

函数声明在解析阶段即完成全量提升，其内部形成的闭包会永久保留对外部变量的引用；而函数表达式仅在赋值阶段初始化，且可能因变量覆盖导致内存释放。例如：

var x = 10;
function declaredFunc()  console.log(x);  // 提升后绑定x=10
var expressedFunc = function()  console.log(x); ; // 运行时x=10
x = 20;
declaredFunc(); // 输出10（提升时x已绑定）
expressedFunc(); // 输出20（运行时取变量最新值）

此差异在模块化开发中尤为关键，函数声明可能因变量覆盖导致意外行为。

五、适用场景与性能考量

• 函数声明：适用于全局工具函数、事件回调等需提前暴露的场景，但可能增加全局命名空间污染风险。
• 函数表达式：适合块级作用域内的私有方法、立即执行函数等场景，可避免变量提升带来的冲突。

性能层面，函数声明因提升机制会占用更多初始内存，而表达式仅在赋值时分配内存。但在现代引擎优化下，两者的执行效率差异已显著缩小。

六、递归与自调用特性

特性	函数声明	函数表达式
递归调用	直接通过名称调用（如factorial(4))	需通过变量名间接调用（如fib(4))
自调用支持	不支持直接自调用（需包装为表达式）	支持立即执行（如(function())())

例如，函数表达式可通过匿名形式实现自调用，而声明式函数需显式调用：

(function()  console.log("自调用"); )(); // 合法
function selfExec()  selfExec();  // 递归需显式调用selfExec()

七、严格模式兼容性

在严格模式下，函数声明的行为更加严格：

• 函数声明：禁止重复声明同名函数，否则抛出SyntaxError
• 函数表达式：允许重复赋值，后赋值会覆盖前值

"use strict";
function test() 
function test()  // 报错：SyntaxError: Duplicate declaration
var test2 = function() ;
var test2 = function() ; // 合法，后者覆盖前者

此特性在模块化开发中需特别注意，避免因重复声明导致兼容性问题。

八、类型判断与元信息获取

通过typeof运算符均返回"function"，但可通过其他方式区分：

console.log(typeof declaredFunc); // "function"
console.log(typeof expressedFunc); // "function"
console.log(declaredFunc.name); // "declaredFunc"
console.log(expressedFunc.name); // "expressedFunc"（若为匿名则返回空字符串）

此外，函数声明的原型链默认继承自Function.prototype，而表达式可通过自定义属性扩展元信息。

通过上述多维度对比可见，函数声明与表达式在语法灵活性、作用域管理、执行时机等方面各有优劣。实际开发中需根据具体场景权衡选择：声明式适用于全局工具方法，表达式更适合局部作用域内的闭包逻辑。理解两者的本质差异，可有效避免变量提升导致的BUG，并优化代码的性能与可维护性。