js函数声明的提升顺序-js教程-PHP中文网

js函数声明的提升顺序

冰川箭仙

发布： 2025-11-12 11:16:02

原创

358人浏览过

函数声明优先提升且覆盖同名变量，多个同名函数后者覆盖前者，函数表达式仅变量提升。

js函数声明的提升顺序

在JavaScript中，函数声明的提升（hoisting）是指函数声明会在代码执行前被“提升”到当前作用域的顶部。理解函数声明的提升顺序，有助于避免运行时错误和意料之外的行为。

函数声明优先于变量声明提升

在同一个作用域中，函数声明会被优先提升，并且优先级高于变量声明。这意味着：

函数声明会完整地被提升到作用域顶部。
变量声明也会被提升，但不会赋值（初始化留在原地）。
如果函数和变量同名，函数声明会先被提升并覆盖变量声明（在提升阶段）。

示例：

console.log(typeof foo); // "function"
foo(); // 能正常执行

var foo = "hello";
function foo() {
  console.log("I am a function");
}

登录后复制

上面代码实际执行时等价于：

function foo() {
  console.log("I am a function");
}
// var foo; （声明被提升，但赋值不提升）
console.log(typeof foo); // "function"
foo(); // 正常调用
foo = "hello"; // 此处才是赋值

登录后复制

多个函数声明同名时，后声明的覆盖前面的

当存在多个同名函数声明时，提升过程中后面的函数会覆盖前面的：

foo(); // 输出 "later"

function foo() {
  console.log("earlier");
}
function foo() {
  console.log("later");
}

登录后复制

因为两个函数都会被提升，但第二个函数声明会覆盖第一个。

SpeakingPass-打造你的专属雅思口语语料

使用chatGPT帮你快速备考雅思口语，提升分数

查看详情

函数表达式不会完全提升

注意：只有函数声明会被完整提升，函数表达式（尤其是匿名函数赋值给变量）只提升变量名，不提升函数体：

foo(); // 报错：foo is not a function

var foo = function () {
  console.log("I'm an expression");
};

登录后复制

这等价于：

var foo;
foo(); // 此时foo是undefined
foo = function () {
  console.log("I'm an expression");
};

登录后复制

总结：

JavaScript中函数声明提升的顺序规则如下：

所有函数声明优先被提升到作用域顶部。
同名函数声明中，后面的覆盖前面的。
变量声明也提升，但不会影响已提升的函数（除非后续赋值覆盖）。
函数表达式遵循变量提升规则，函数体不会提升。

基本上就这些。

以上就是js函数声明的提升顺序的详细内容，更多请关注php中文网其它相关文章！

大家都在看：

SVG路径滚动绘制教程：优化动画流畅度与提前显示 SVG滚动动画：实现路径绘制的平滑过渡与提前触发 AJAX数据中嵌套JSON字符串的解析与处理：避免属性访问undefined SVG路径滚动动画优化：实现平滑与提前绘制 JS函数怎样定义私有函数_JS私有函数定义与封装技巧分析