登录
首页 >  文章 >  前端

变量提升是什么?JavaScript如何理解它?

时间:2026-05-13 18:34:38 497浏览 收藏

变量提升是JavaScript中一个看似“代码被提前执行”实则源于编译阶段声明收集机制的核心概念——var声明会被提升并初始化为undefined,let/const虽被提升却因暂时性死区(TDZ)而禁止提前访问,函数声明整体提升可先调用后定义,而函数表达式仅变量名被提升;理解它不是为了背规则,而是看清JavaScript“编译—执行”两阶段本质,从而写出更可靠、无隐式陷阱的代码。

什么是变量提升_javascript中如何理解它?

变量提升(Hoisting)是 JavaScript 中一个容易让人困惑的概念,它指的是变量和函数声明在代码执行前被“移动”到当前作用域顶部的现象。注意:不是真的移动代码,而是 JavaScript 引擎在编译阶段就记住了这些声明,让它们在作用域内“看起来”像是提前存在了。

var 声明会被提升并初始化为 undefined

var 声明的变量,声明会被提升,同时会被自动赋值为 undefined。所以你可以在声明之前访问它,不会报错,但值是 undefined

  • console.log(a); // undefined
  • var a = 10;

这等价于:

  • var a; // 提升并初始化为 undefined
  • console.log(a); // undefined
  • a = 10; // 赋值不提升

let 和 const 声明只提升不初始化(存在暂时性死区)

letconst 声明也会被提升,但不会被初始化。在声明语句执行前访问它们,会直接抛出 ReferenceError,这个区域叫“暂时性死区”(Temporal Dead Zone, TDZ)。

  • console.log(b); // ReferenceError: Cannot access 'b' before initialization
  • let b = 20;

函数声明整体提升,函数表达式只有 var 部分提升

函数声明(function foo() {...})会被完整提升,包括函数名和函数体,所以可以先调用后定义。

  • foo(); // 正常运行,输出 "hello"
  • function foo() { console.log("hello"); }

而函数表达式(如 var bar = function() {...})只提升 var bar,不提升赋值,因此调用会报 TypeError

  • bar(); // TypeError: bar is not a function
  • var bar = function() { console.log("world"); };

提升只发生在当前作用域内

提升不是全局的,它严格按作用域(函数作用域或块级作用域)发生。比如函数内部的 var 只在该函数内提升,不会影响外层;let/const 在块(如 if、for)中声明,也只在该块内有效,且受 TDZ 约束。

基本上就这些。理解提升的关键不是记住“代码被挪到上面”,而是明白 JavaScript 分“编译阶段”(收集声明)和“执行阶段”(运行代码),而不同声明方式在这两个阶段的行为不同。

以上就是本文的全部内容了,是否有顺利帮助你解决问题?若是能给你带来学习上的帮助,请大家多多支持golang学习网!更多关于文章的相关知识,也可关注golang学习网公众号。

资料下载
相关阅读
更多>
最新阅读
更多>
课程推荐
更多>