JavaScript立即调用函数表达式：区分函数声明与函数表达式

JS里区分函数声明和函数表达式，核心看语法上下文——引擎是把它当作独立语句，还是当作一个可被计算的值来处理。

一、函数声明 #

function pushToColorArray() {
    // Function body
};

这是标准的函数声明，原因是：

• 它是一个独立的语句，没有嵌套在任何表达式语境里（比如赋值操作、括号、函数参数等）
• 引擎会将其**提升（hoist）**到当前作用域的顶部，意味着你可以在声明代码之前就调用这个函数
• 函数名pushToColorArray在当前作用域内全局可用，你可以在任何地方直接调用pushToColorArray()

二、IIFE：具名函数表达式 #

(function pushToColorArray() {
    // Function body
})();

这是立即调用函数表达式（IIFE），本质是被包裹的具名函数表达式，原因是：

• 外层的括号()改变了语法上下文：JS引擎会把括号内部的内容当作表达式解析，而非独立的函数声明
• 这里的function pushToColorArray()不再是独立语句，而是一个可被求值的“函数值”——求值结果就是这个函数本身，后面的()就是立即调用这个函数值
• 函数名pushToColorArray只在函数内部可用，外部作用域无法访问它（避免污染全局命名空间是IIFE的核心用途之一）
• 它不会被提升，只有在代码执行到这一行时才会定义并立即执行

关键差异总结 #

• 语法触发条件：函数声明必须是独立语句；函数表达式需处于表达式语境（括号包裹、赋值给变量、作为参数等）
• 提升规则：函数声明整体提升；函数表达式仅变量（若赋值）会提升，函数体不会
• 作用域可见性：函数声明的名字在当前作用域全局可见；IIFE的具名表达式名字仅内部可见
• 执行时机：函数声明需手动调用；IIFE定义后自动执行

内容的提问来源于stack exchange，提问作者alstorx