发布于 2024 年 2 月 26 日，星期一
变量提升是JavaScript中的一种特性，本质上是由于JavaScript在执行代码前会进行一次预解析，将变量和函数的声明提升到作用域的顶部。这种机制虽然简化了代码编写，但也可能导致一些问题，如变量未定义错误、逻辑混乱等。开发者在使用变量时需注意其作用域和生命周期，避免因变量提升而引发的意外行为。理解变量提升的本质有助于编写更清晰、可维护的代码。
欢迎关注 『非同质前端札记』https://mp.weixin.qq.com/s?__biz=MzkyOTI2MzE0MQ==&mid=2247485576&idx=1&sn=5ddfe93f427f05f5d126dead859d0dc8&chksm=c20d73c2f57afad4bbea380dfa1bcc15367a4cc06bf5dd0603100e8bd7bb317009fa65442cdb&token=1071012447&lang=zh_CN#rd 公众号 ，一起探索学习前端技术......
前端小菜鸡一枚，分享的文章纯属个人见解，若有不正确或可待讨论点可随意评论，与各位同学一起学习~
无论是函数还是变量在那个位置上声明，都会被提升到函数之前，可保证变量声明前可访问而不会报错
变量提升的本质：js 引擎在代码执行前有一个解析的过程，会创建一个执行上下文，初始化一些代码执行所需要的参数。当访问一个变量时，会在当前执行上下文的作用域链中去查找，而作用域链的首端指向的是当前执行上下文的变量对象，这个变量对象是执行上下文的一个属性，它包含了函数的形参，所有函数和变量声明，这个对象是在代码解析的时候创建的。
a = 1;var a;console.log(a); // 1
var tmp = new Date();function fn(){ console.log(tmp); if(false){ var tmp = 'hello world'; }}fn(); // undefined/**
* 在这个函数中，原本是要打印出外层的tmp变量，但是因为变量提升的问题，
* 内层定义的tmp被提到函数内部的最顶部，相当于覆盖了外层的tmp，所以打印结果为undefined。
*/
for (var i = 0; i < 3; i++){ setTimeout(() => { console.log(i); }, 2000);} // 3 3 3for (let i = 0; i < 3; i++){ setTimeout(() => { console.log(i); }, 2000);} // 0 1 2/**
* 由于遍历时定义的i会变量提升成为一个全局变量，在函数结束之后不会被销毁，
* 所以，一直修改的是之前的定义的全局变量，所以第一个输出三次 3, 第二个输出 0 1 2。
*//**
* 在 for 循环中，let 声明的变量会存在一个块级作用域的概念，使用 let 声明的迭代变量时，
* js 引擎会在后台为每一个迭代循环声明一个新的迭代变量，因此每次使用的 i 都是不同的。
*/
Q:(question)R:(result)A:(attention matters)D:(detail info)S:(summary)Ana:(analysis)T:(tips)